Files
MealQuest/design/MealQuest UI Designs/MealQuest Color Schemes.dc.html
2026-10-02 15:09:42 -04:00

863 lines
274 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="./support.js"></script>
</head>
<body>
<x-dc>
<helmet data-dc-atomics>
<meta name="design_doc_mode" content="canvas">
<link rel="stylesheet" href="_ds/organic-cd54d318-425e-4a60-adfb-d590f70d40bd/styles.css">
<style>body{margin:0;background:#e9e4dc;font-family:var(--font-body)}a{color:var(--color-accent-700)}a:hover{color:var(--color-accent-800)}</style>
</helmet>
<div style="padding:40px;display:flex;flex-direction:column;gap:28px">
<div style="font-family:var(--font-heading);font-size:36px;color:var(--color-text)">MealQuest · purple color schemes</div>
<div style="font-family:var(--font-heading);font-size:26px;color:var(--color-text);margin-top:8px">Round 2 · Purple + blue</div>
<div id="b1" style="--color-accent:oklch(0.5 0.13 310);--color-accent-100:oklch(0.97 0.030 310);--color-accent-200:oklch(0.93 0.060 310);--color-accent-300:oklch(0.86 0.090 310);--color-accent-400:oklch(0.77 0.120 310);--color-accent-500:oklch(0.67 0.140 310);--color-accent-600:oklch(0.57 0.140 310);--color-accent-700:oklch(0.47 0.130 310);--color-accent-800:oklch(0.37 0.110 310);--color-accent-900:oklch(0.27 0.080 310);--on-accent:var(--color-bg);--color-accent-2:oklch(0.62 0.11 235);--color-accent-2-100:oklch(0.97 0.030 235);--color-accent-2-200:oklch(0.93 0.060 235);--color-accent-2-300:oklch(0.86 0.090 235);--color-accent-2-400:oklch(0.77 0.120 235);--color-accent-2-500:oklch(0.67 0.140 235);--color-accent-2-600:oklch(0.57 0.140 235);--color-accent-2-700:oklch(0.47 0.130 235);--color-accent-2-800:oklch(0.37 0.110 235);--color-accent-2-900:oklch(0.27 0.080 235);padding:32px 40px;border-radius:40px;background:var(--color-bg);display:flex;flex-direction:column;gap:20px;color:var(--color-text);font-family:var(--font-body)">
<div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:4px;min-width:280px"><div style="font-family:var(--font-heading);font-size:28px;line-height:1.15;white-space:nowrap">B1 · Plum + sky blue · cream</div><div style="font-size:14px;color:var(--color-neutral-800)">Soft, airy blue; the warm cream keeps it friendly.</div></div><div style="display:flex;gap:8px"><span style="width:44px;height:44px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent-2);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-divider)"></span></div><div style="display:flex;gap:3px"><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-100)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-200)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-300)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-400)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-500)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-600)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-700)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-800)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-900)"></span></div><div style="display:flex;gap:3px"><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-100)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-200)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-300)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-400)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-500)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-600)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-700)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-800)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-900)"></span></div></div>
<div style="display:flex;gap:28px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Home</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-start">
<div><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Friday, Oct 2</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Tonight's quest</div></div>
<div style="position:relative;width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="19" height="19" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><span style="position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span></div>
</div>
<div style="margin:14px 20px 0;border-radius:32px;background:var(--color-surface);overflow:hidden;display:flex;flex-direction:column">
<div style="height:150px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:2px 18px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px"><div><div style="font-family:var(--font-heading);font-size:22px;line-height:1.1">Pizza night</div><div style="font-size:12px;color:var(--color-neutral-700);margin-top:4px">Regular · 40 min</div></div><div style="height:38px;padding:0 16px;border-radius:999px;background:var(--color-text);color:var(--color-bg);display:flex;align-items:center;font-family:var(--font-heading);font-size:13px">Recipe</div></div>
</div>
<div style="margin:12px 20px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px">
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent);color:var(--on-accent);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Quick dinner</span></div>
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent-2-300);color:var(--color-accent-2-900);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Cook from what I have</span></div>
</div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg><span style="flex:1;font-size:13px;font-weight:700">10 new side quests to swipe</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg><span style="flex:1;font-size:13px;font-weight:700">Shopping list ready · Oct 5–11</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>Home</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Discover</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:8px 20px 0;display:flex;align-items:flex-end;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Discover</div><div style="font-family:var(--font-heading);font-size:30px;line-height:1.1">Side quests</div></div>
<div style="display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--color-accent-2-200);color:var(--color-accent-2-800);font-size:12px;font-weight:700">Quest log · 6</div>
</div>
<div style="position:relative;margin:18px 20px 0;height:440px">
<div style="position:absolute;inset:0;transform:translateY(16px) scale(.9);border-radius:32px;background:var(--color-neutral-300)"></div>
<div style="position:absolute;inset:0;transform:translateY(8px) scale(.95);border-radius:32px;background:var(--color-surface)"></div>
<div style="position:absolute;inset:0;border-radius:32px;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column">
<div style="height:220px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:4px 20px 0;display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:center;justify-content:space-between"><div style="font-family:var(--font-heading);font-size:24px;line-height:1.1">Korean beef bowls</div></div>
<div style="display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-neutral-700)"><span style="display:flex;gap:3px"><span style="width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span></span>Easy</div>
<div style="padding:12px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:13px;line-height:1.45"><b>Why this?</b> You make Chicken stir-fry and Beef tacos most weeks. Same flavors, sweet-savory twist.</div>
</div>
</div>
</div>
<div style="display:flex;justify-content:center;gap:28px;margin-top:22px">
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-neutral-100);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-text)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></div>Pass</div>
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-accent-2-600);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-bg)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path></svg></div>Try it</div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>Discover</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Weekly plan</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;align-items:center;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Week 41</div><div style="font-family:var(--font-heading);font-size:26px;line-height:1.1">Oct 5 – 11</div></div>
<div style="display:flex;gap:6px"><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m15 18-6-6 6-6"></path></svg></div><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div></div>
</div>
<div style="margin:14px 20px 0;padding:10px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:12px;line-height:1.4;display:flex;gap:8px;align-items:center"><svg viewBox="0 0 24 24" width="16" height="16" style="flex:none;fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg><span>5 regulars + 2 side quests · synced to Google Calendar</span></div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:6px">
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">MON<br><span style="font-size:16px;color:var(--color-text)">5</span></div><div style="flex:1;font-weight:700;font-size:14px">Beef tacos</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">TUE<br><span style="font-size:16px;color:var(--color-text)">6</span></div><div style="flex:1;font-weight:700;font-size:14px">Spaghetti bolognese</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">WED<br><span style="font-size:16px;color:var(--color-text)">7</span></div><div style="flex:1;font-weight:700;font-size:14px">Crock pot tikka masala</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">THU<br><span style="font-size:16px;color:var(--color-text)">8</span></div><div style="flex:1;font-weight:700;font-size:14px">Chicken stir-fry</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">FRI<br><span style="font-size:16px;color:var(--color-text)">9</span></div><div style="flex:1;font-weight:700;font-size:14px">Pizza night</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">SAT<br><span style="font-size:16px;color:var(--color-text)">10</span></div><div style="flex:1;font-weight:700;font-size:14px">Korean beef bowls</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">SUN<br><span style="font-size:16px;color:var(--color-text)">11</span></div><div style="flex:1;font-weight:700;font-size:14px">Sheet-pan salmon</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
</div>
<div style="margin:14px 20px 0;height:50px;border-radius:999px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-heading);font-size:15px;color:var(--on-accent)"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg>Shopping list · 23 items</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Shopping list</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-end"><div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Supply run · Oct 5–11</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Shopping list</div></div><div style="font-size:13px;font-weight:700;color:var(--color-neutral-700)">19 / 23</div></div>
<div style="margin:10px 20px 0;font-size:12px;line-height:1.45;color:var(--color-neutral-800)">Uncheck anything you already have — it won't be counted.</div>
<div style="padding:12px 20px 0;display:flex;flex-direction:column;gap:12px">
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Beef tacos</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">MON</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Ground beef</span><span style="color:var(--color-neutral-700);font-size:12px">1 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Corn tortillas</span><span style="color:var(--color-neutral-700);font-size:12px">12</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Taco seasoning</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Crock pot tikka masala</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">WED</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Chicken thighs</span><span style="color:var(--color-neutral-700);font-size:12px">2 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Tikka masala paste</span><span style="color:var(--color-neutral-700);font-size:12px">1 jar</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Basmati rice</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Chicken stir-fry</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">THU · 5 items</span></div>
</div>
<div style="position:absolute;left:20px;right:20px;bottom:96px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-accent-2-800)"><svg viewBox="0 0 24 24" width="15" height="15" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>Sent to Google Chat · Sat 8:00 am</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div></div>
</div>
<div id="b2" style="--color-bg:oklch(0.975 0.008 85);--color-surface:oklch(0.935 0.016 85);--color-accent:oklch(0.5 0.13 310);--color-accent-100:oklch(0.97 0.030 310);--color-accent-200:oklch(0.93 0.060 310);--color-accent-300:oklch(0.86 0.090 310);--color-accent-400:oklch(0.77 0.120 310);--color-accent-500:oklch(0.67 0.140 310);--color-accent-600:oklch(0.57 0.140 310);--color-accent-700:oklch(0.47 0.130 310);--color-accent-800:oklch(0.37 0.110 310);--color-accent-900:oklch(0.27 0.080 310);--on-accent:var(--color-bg);--color-accent-2:oklch(0.58 0.07 255);--color-accent-2-100:oklch(0.97 0.018 255);--color-accent-2-200:oklch(0.93 0.036 255);--color-accent-2-300:oklch(0.86 0.054 255);--color-accent-2-400:oklch(0.77 0.072 255);--color-accent-2-500:oklch(0.67 0.084 255);--color-accent-2-600:oklch(0.57 0.084 255);--color-accent-2-700:oklch(0.47 0.078 255);--color-accent-2-800:oklch(0.37 0.066 255);--color-accent-2-900:oklch(0.27 0.048 255);padding:32px 40px;border-radius:40px;background:var(--color-bg);display:flex;flex-direction:column;gap:20px;color:var(--color-text);font-family:var(--font-body)">
<div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:4px;min-width:280px"><div style="font-family:var(--font-heading);font-size:28px;line-height:1.15;white-space:nowrap">B2 · Plum + slate blue · off-white</div><div style="font-size:14px;color:var(--color-neutral-800)">Muted, grown-up blue on a cleaner ground.</div></div><div style="display:flex;gap:8px"><span style="width:44px;height:44px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent-2);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-divider)"></span></div><div style="display:flex;gap:3px"><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-100)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-200)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-300)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-400)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-500)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-600)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-700)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-800)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-900)"></span></div><div style="display:flex;gap:3px"><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-100)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-200)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-300)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-400)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-500)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-600)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-700)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-800)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-900)"></span></div></div>
<div style="display:flex;gap:28px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Home</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-start">
<div><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Friday, Oct 2</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Tonight's quest</div></div>
<div style="position:relative;width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="19" height="19" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><span style="position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span></div>
</div>
<div style="margin:14px 20px 0;border-radius:32px;background:var(--color-surface);overflow:hidden;display:flex;flex-direction:column">
<div style="height:150px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:2px 18px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px"><div><div style="font-family:var(--font-heading);font-size:22px;line-height:1.1">Pizza night</div><div style="font-size:12px;color:var(--color-neutral-700);margin-top:4px">Regular · 40 min</div></div><div style="height:38px;padding:0 16px;border-radius:999px;background:var(--color-text);color:var(--color-bg);display:flex;align-items:center;font-family:var(--font-heading);font-size:13px">Recipe</div></div>
</div>
<div style="margin:12px 20px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px">
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent);color:var(--on-accent);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Quick dinner</span></div>
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent-2-300);color:var(--color-accent-2-900);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Cook from what I have</span></div>
</div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg><span style="flex:1;font-size:13px;font-weight:700">10 new side quests to swipe</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg><span style="flex:1;font-size:13px;font-weight:700">Shopping list ready · Oct 5–11</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>Home</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Discover</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:8px 20px 0;display:flex;align-items:flex-end;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Discover</div><div style="font-family:var(--font-heading);font-size:30px;line-height:1.1">Side quests</div></div>
<div style="display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--color-accent-2-200);color:var(--color-accent-2-800);font-size:12px;font-weight:700">Quest log · 6</div>
</div>
<div style="position:relative;margin:18px 20px 0;height:440px">
<div style="position:absolute;inset:0;transform:translateY(16px) scale(.9);border-radius:32px;background:var(--color-neutral-300)"></div>
<div style="position:absolute;inset:0;transform:translateY(8px) scale(.95);border-radius:32px;background:var(--color-surface)"></div>
<div style="position:absolute;inset:0;border-radius:32px;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column">
<div style="height:220px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:4px 20px 0;display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:center;justify-content:space-between"><div style="font-family:var(--font-heading);font-size:24px;line-height:1.1">Korean beef bowls</div></div>
<div style="display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-neutral-700)"><span style="display:flex;gap:3px"><span style="width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span></span>Easy</div>
<div style="padding:12px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:13px;line-height:1.45"><b>Why this?</b> You make Chicken stir-fry and Beef tacos most weeks. Same flavors, sweet-savory twist.</div>
</div>
</div>
</div>
<div style="display:flex;justify-content:center;gap:28px;margin-top:22px">
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-neutral-100);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-text)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></div>Pass</div>
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-accent-2-600);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-bg)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path></svg></div>Try it</div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>Discover</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Weekly plan</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;align-items:center;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Week 41</div><div style="font-family:var(--font-heading);font-size:26px;line-height:1.1">Oct 5 – 11</div></div>
<div style="display:flex;gap:6px"><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m15 18-6-6 6-6"></path></svg></div><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div></div>
</div>
<div style="margin:14px 20px 0;padding:10px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:12px;line-height:1.4;display:flex;gap:8px;align-items:center"><svg viewBox="0 0 24 24" width="16" height="16" style="flex:none;fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg><span>5 regulars + 2 side quests · synced to Google Calendar</span></div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:6px">
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">MON<br><span style="font-size:16px;color:var(--color-text)">5</span></div><div style="flex:1;font-weight:700;font-size:14px">Beef tacos</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">TUE<br><span style="font-size:16px;color:var(--color-text)">6</span></div><div style="flex:1;font-weight:700;font-size:14px">Spaghetti bolognese</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">WED<br><span style="font-size:16px;color:var(--color-text)">7</span></div><div style="flex:1;font-weight:700;font-size:14px">Crock pot tikka masala</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">THU<br><span style="font-size:16px;color:var(--color-text)">8</span></div><div style="flex:1;font-weight:700;font-size:14px">Chicken stir-fry</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">FRI<br><span style="font-size:16px;color:var(--color-text)">9</span></div><div style="flex:1;font-weight:700;font-size:14px">Pizza night</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">SAT<br><span style="font-size:16px;color:var(--color-text)">10</span></div><div style="flex:1;font-weight:700;font-size:14px">Korean beef bowls</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">SUN<br><span style="font-size:16px;color:var(--color-text)">11</span></div><div style="flex:1;font-weight:700;font-size:14px">Sheet-pan salmon</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
</div>
<div style="margin:14px 20px 0;height:50px;border-radius:999px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-heading);font-size:15px;color:var(--on-accent)"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg>Shopping list · 23 items</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Shopping list</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-end"><div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Supply run · Oct 5–11</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Shopping list</div></div><div style="font-size:13px;font-weight:700;color:var(--color-neutral-700)">19 / 23</div></div>
<div style="margin:10px 20px 0;font-size:12px;line-height:1.45;color:var(--color-neutral-800)">Uncheck anything you already have — it won't be counted.</div>
<div style="padding:12px 20px 0;display:flex;flex-direction:column;gap:12px">
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Beef tacos</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">MON</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Ground beef</span><span style="color:var(--color-neutral-700);font-size:12px">1 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Corn tortillas</span><span style="color:var(--color-neutral-700);font-size:12px">12</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Taco seasoning</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Crock pot tikka masala</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">WED</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Chicken thighs</span><span style="color:var(--color-neutral-700);font-size:12px">2 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Tikka masala paste</span><span style="color:var(--color-neutral-700);font-size:12px">1 jar</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Basmati rice</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Chicken stir-fry</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">THU · 5 items</span></div>
</div>
<div style="position:absolute;left:20px;right:20px;bottom:96px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-accent-2-800)"><svg viewBox="0 0 24 24" width="15" height="15" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>Sent to Google Chat · Sat 8:00 am</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div></div>
</div>
<div id="b3" style="--color-accent:oklch(0.42 0.14 300);--color-accent-100:oklch(0.97 0.032 300);--color-accent-200:oklch(0.93 0.063 300);--color-accent-300:oklch(0.86 0.095 300);--color-accent-400:oklch(0.77 0.126 300);--color-accent-500:oklch(0.67 0.147 300);--color-accent-600:oklch(0.57 0.147 300);--color-accent-700:oklch(0.47 0.137 300);--color-accent-800:oklch(0.37 0.116 300);--color-accent-900:oklch(0.27 0.084 300);--on-accent:var(--color-bg);--color-accent-2:oklch(0.64 0.11 275);--color-accent-2-100:oklch(0.97 0.030 275);--color-accent-2-200:oklch(0.93 0.060 275);--color-accent-2-300:oklch(0.86 0.090 275);--color-accent-2-400:oklch(0.77 0.120 275);--color-accent-2-500:oklch(0.67 0.140 275);--color-accent-2-600:oklch(0.57 0.140 275);--color-accent-2-700:oklch(0.47 0.130 275);--color-accent-2-800:oklch(0.37 0.110 275);--color-accent-2-900:oklch(0.27 0.080 275);padding:32px 40px;border-radius:40px;background:var(--color-bg);display:flex;flex-direction:column;gap:20px;color:var(--color-text);font-family:var(--font-body)">
<div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:4px;min-width:280px"><div style="font-family:var(--font-heading);font-size:28px;line-height:1.15;white-space:nowrap">B3 · Grape + periwinkle · cream</div><div style="font-size:14px;color:var(--color-neutral-800)">Purple-leaning blue; the most harmonious, lowest-contrast pair.</div></div><div style="display:flex;gap:8px"><span style="width:44px;height:44px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent-2);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-divider)"></span></div><div style="display:flex;gap:3px"><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-100)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-200)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-300)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-400)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-500)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-600)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-700)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-800)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-900)"></span></div><div style="display:flex;gap:3px"><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-100)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-200)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-300)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-400)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-500)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-600)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-700)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-800)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-900)"></span></div></div>
<div style="display:flex;gap:28px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Home</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-start">
<div><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Friday, Oct 2</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Tonight's quest</div></div>
<div style="position:relative;width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="19" height="19" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><span style="position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span></div>
</div>
<div style="margin:14px 20px 0;border-radius:32px;background:var(--color-surface);overflow:hidden;display:flex;flex-direction:column">
<div style="height:150px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:2px 18px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px"><div><div style="font-family:var(--font-heading);font-size:22px;line-height:1.1">Pizza night</div><div style="font-size:12px;color:var(--color-neutral-700);margin-top:4px">Regular · 40 min</div></div><div style="height:38px;padding:0 16px;border-radius:999px;background:var(--color-text);color:var(--color-bg);display:flex;align-items:center;font-family:var(--font-heading);font-size:13px">Recipe</div></div>
</div>
<div style="margin:12px 20px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px">
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent);color:var(--on-accent);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Quick dinner</span></div>
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent-2-300);color:var(--color-accent-2-900);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Cook from what I have</span></div>
</div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg><span style="flex:1;font-size:13px;font-weight:700">10 new side quests to swipe</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg><span style="flex:1;font-size:13px;font-weight:700">Shopping list ready · Oct 5–11</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>Home</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Discover</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:8px 20px 0;display:flex;align-items:flex-end;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Discover</div><div style="font-family:var(--font-heading);font-size:30px;line-height:1.1">Side quests</div></div>
<div style="display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--color-accent-2-200);color:var(--color-accent-2-800);font-size:12px;font-weight:700">Quest log · 6</div>
</div>
<div style="position:relative;margin:18px 20px 0;height:440px">
<div style="position:absolute;inset:0;transform:translateY(16px) scale(.9);border-radius:32px;background:var(--color-neutral-300)"></div>
<div style="position:absolute;inset:0;transform:translateY(8px) scale(.95);border-radius:32px;background:var(--color-surface)"></div>
<div style="position:absolute;inset:0;border-radius:32px;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column">
<div style="height:220px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:4px 20px 0;display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:center;justify-content:space-between"><div style="font-family:var(--font-heading);font-size:24px;line-height:1.1">Korean beef bowls</div></div>
<div style="display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-neutral-700)"><span style="display:flex;gap:3px"><span style="width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span></span>Easy</div>
<div style="padding:12px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:13px;line-height:1.45"><b>Why this?</b> You make Chicken stir-fry and Beef tacos most weeks. Same flavors, sweet-savory twist.</div>
</div>
</div>
</div>
<div style="display:flex;justify-content:center;gap:28px;margin-top:22px">
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-neutral-100);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-text)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></div>Pass</div>
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-accent-2-600);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-bg)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path></svg></div>Try it</div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>Discover</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Weekly plan</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;align-items:center;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Week 41</div><div style="font-family:var(--font-heading);font-size:26px;line-height:1.1">Oct 5 – 11</div></div>
<div style="display:flex;gap:6px"><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m15 18-6-6 6-6"></path></svg></div><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div></div>
</div>
<div style="margin:14px 20px 0;padding:10px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:12px;line-height:1.4;display:flex;gap:8px;align-items:center"><svg viewBox="0 0 24 24" width="16" height="16" style="flex:none;fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg><span>5 regulars + 2 side quests · synced to Google Calendar</span></div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:6px">
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">MON<br><span style="font-size:16px;color:var(--color-text)">5</span></div><div style="flex:1;font-weight:700;font-size:14px">Beef tacos</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">TUE<br><span style="font-size:16px;color:var(--color-text)">6</span></div><div style="flex:1;font-weight:700;font-size:14px">Spaghetti bolognese</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">WED<br><span style="font-size:16px;color:var(--color-text)">7</span></div><div style="flex:1;font-weight:700;font-size:14px">Crock pot tikka masala</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">THU<br><span style="font-size:16px;color:var(--color-text)">8</span></div><div style="flex:1;font-weight:700;font-size:14px">Chicken stir-fry</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">FRI<br><span style="font-size:16px;color:var(--color-text)">9</span></div><div style="flex:1;font-weight:700;font-size:14px">Pizza night</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">SAT<br><span style="font-size:16px;color:var(--color-text)">10</span></div><div style="flex:1;font-weight:700;font-size:14px">Korean beef bowls</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">SUN<br><span style="font-size:16px;color:var(--color-text)">11</span></div><div style="flex:1;font-weight:700;font-size:14px">Sheet-pan salmon</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
</div>
<div style="margin:14px 20px 0;height:50px;border-radius:999px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-heading);font-size:15px;color:var(--on-accent)"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg>Shopping list · 23 items</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Shopping list</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-end"><div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Supply run · Oct 5–11</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Shopping list</div></div><div style="font-size:13px;font-weight:700;color:var(--color-neutral-700)">19 / 23</div></div>
<div style="margin:10px 20px 0;font-size:12px;line-height:1.45;color:var(--color-neutral-800)">Uncheck anything you already have — it won't be counted.</div>
<div style="padding:12px 20px 0;display:flex;flex-direction:column;gap:12px">
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Beef tacos</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">MON</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Ground beef</span><span style="color:var(--color-neutral-700);font-size:12px">1 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Corn tortillas</span><span style="color:var(--color-neutral-700);font-size:12px">12</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Taco seasoning</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Crock pot tikka masala</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">WED</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Chicken thighs</span><span style="color:var(--color-neutral-700);font-size:12px">2 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Tikka masala paste</span><span style="color:var(--color-neutral-700);font-size:12px">1 jar</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Basmati rice</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Chicken stir-fry</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">THU · 5 items</span></div>
</div>
<div style="position:absolute;left:20px;right:20px;bottom:96px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-accent-2-800)"><svg viewBox="0 0 24 24" width="15" height="15" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>Sent to Google Chat · Sat 8:00 am</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div></div>
</div>
<div id="b4" style="--color-bg:oklch(0.975 0.008 85);--color-surface:oklch(0.935 0.016 85);--color-accent:oklch(0.42 0.14 300);--color-accent-100:oklch(0.97 0.032 300);--color-accent-200:oklch(0.93 0.063 300);--color-accent-300:oklch(0.86 0.095 300);--color-accent-400:oklch(0.77 0.126 300);--color-accent-500:oklch(0.67 0.147 300);--color-accent-600:oklch(0.57 0.147 300);--color-accent-700:oklch(0.47 0.137 300);--color-accent-800:oklch(0.37 0.116 300);--color-accent-900:oklch(0.27 0.084 300);--on-accent:var(--color-bg);--color-accent-2:oklch(0.58 0.09 215);--color-accent-2-100:oklch(0.97 0.030 215);--color-accent-2-200:oklch(0.93 0.060 215);--color-accent-2-300:oklch(0.86 0.090 215);--color-accent-2-400:oklch(0.77 0.120 215);--color-accent-2-500:oklch(0.67 0.140 215);--color-accent-2-600:oklch(0.57 0.140 215);--color-accent-2-700:oklch(0.47 0.130 215);--color-accent-2-800:oklch(0.37 0.110 215);--color-accent-2-900:oklch(0.27 0.080 215);padding:32px 40px;border-radius:40px;background:var(--color-bg);display:flex;flex-direction:column;gap:20px;color:var(--color-text);font-family:var(--font-body)">
<div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:4px;min-width:280px"><div style="font-family:var(--font-heading);font-size:28px;line-height:1.15;white-space:nowrap">B4 · Grape + teal blue · off-white</div><div style="font-size:14px;color:var(--color-neutral-800)">Green-leaning blue gives the strongest contrast with grape.</div></div><div style="display:flex;gap:8px"><span style="width:44px;height:44px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent-2);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-divider)"></span></div><div style="display:flex;gap:3px"><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-100)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-200)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-300)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-400)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-500)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-600)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-700)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-800)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-900)"></span></div><div style="display:flex;gap:3px"><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-100)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-200)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-300)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-400)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-500)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-600)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-700)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-800)"></span><span style="width:18px;height:44px;border-radius:999px;background:var(--color-accent-2-900)"></span></div></div>
<div style="display:flex;gap:28px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Home</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-start">
<div><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Friday, Oct 2</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Tonight's quest</div></div>
<div style="position:relative;width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="19" height="19" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><span style="position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span></div>
</div>
<div style="margin:14px 20px 0;border-radius:32px;background:var(--color-surface);overflow:hidden;display:flex;flex-direction:column">
<div style="height:150px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:2px 18px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px"><div><div style="font-family:var(--font-heading);font-size:22px;line-height:1.1">Pizza night</div><div style="font-size:12px;color:var(--color-neutral-700);margin-top:4px">Regular · 40 min</div></div><div style="height:38px;padding:0 16px;border-radius:999px;background:var(--color-text);color:var(--color-bg);display:flex;align-items:center;font-family:var(--font-heading);font-size:13px">Recipe</div></div>
</div>
<div style="margin:12px 20px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px">
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent);color:var(--on-accent);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Quick dinner</span></div>
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent-2-300);color:var(--color-accent-2-900);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Cook from what I have</span></div>
</div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg><span style="flex:1;font-size:13px;font-weight:700">10 new side quests to swipe</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg><span style="flex:1;font-size:13px;font-weight:700">Shopping list ready · Oct 5–11</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>Home</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Discover</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:8px 20px 0;display:flex;align-items:flex-end;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Discover</div><div style="font-family:var(--font-heading);font-size:30px;line-height:1.1">Side quests</div></div>
<div style="display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--color-accent-2-200);color:var(--color-accent-2-800);font-size:12px;font-weight:700">Quest log · 6</div>
</div>
<div style="position:relative;margin:18px 20px 0;height:440px">
<div style="position:absolute;inset:0;transform:translateY(16px) scale(.9);border-radius:32px;background:var(--color-neutral-300)"></div>
<div style="position:absolute;inset:0;transform:translateY(8px) scale(.95);border-radius:32px;background:var(--color-surface)"></div>
<div style="position:absolute;inset:0;border-radius:32px;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column">
<div style="height:220px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:4px 20px 0;display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:center;justify-content:space-between"><div style="font-family:var(--font-heading);font-size:24px;line-height:1.1">Korean beef bowls</div></div>
<div style="display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-neutral-700)"><span style="display:flex;gap:3px"><span style="width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span></span>Easy</div>
<div style="padding:12px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:13px;line-height:1.45"><b>Why this?</b> You make Chicken stir-fry and Beef tacos most weeks. Same flavors, sweet-savory twist.</div>
</div>
</div>
</div>
<div style="display:flex;justify-content:center;gap:28px;margin-top:22px">
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-neutral-100);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-text)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></div>Pass</div>
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-accent-2-600);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-bg)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path></svg></div>Try it</div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>Discover</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Weekly plan</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;align-items:center;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Week 41</div><div style="font-family:var(--font-heading);font-size:26px;line-height:1.1">Oct 5 – 11</div></div>
<div style="display:flex;gap:6px"><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m15 18-6-6 6-6"></path></svg></div><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div></div>
</div>
<div style="margin:14px 20px 0;padding:10px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:12px;line-height:1.4;display:flex;gap:8px;align-items:center"><svg viewBox="0 0 24 24" width="16" height="16" style="flex:none;fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg><span>5 regulars + 2 side quests · synced to Google Calendar</span></div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:6px">
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">MON<br><span style="font-size:16px;color:var(--color-text)">5</span></div><div style="flex:1;font-weight:700;font-size:14px">Beef tacos</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">TUE<br><span style="font-size:16px;color:var(--color-text)">6</span></div><div style="flex:1;font-weight:700;font-size:14px">Spaghetti bolognese</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">WED<br><span style="font-size:16px;color:var(--color-text)">7</span></div><div style="flex:1;font-weight:700;font-size:14px">Crock pot tikka masala</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">THU<br><span style="font-size:16px;color:var(--color-text)">8</span></div><div style="flex:1;font-weight:700;font-size:14px">Chicken stir-fry</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">FRI<br><span style="font-size:16px;color:var(--color-text)">9</span></div><div style="flex:1;font-weight:700;font-size:14px">Pizza night</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">SAT<br><span style="font-size:16px;color:var(--color-text)">10</span></div><div style="flex:1;font-weight:700;font-size:14px">Korean beef bowls</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">SUN<br><span style="font-size:16px;color:var(--color-text)">11</span></div><div style="flex:1;font-weight:700;font-size:14px">Sheet-pan salmon</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
</div>
<div style="margin:14px 20px 0;height:50px;border-radius:999px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-heading);font-size:15px;color:var(--on-accent)"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg>Shopping list · 23 items</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Shopping list</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-end"><div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Supply run · Oct 5–11</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Shopping list</div></div><div style="font-size:13px;font-weight:700;color:var(--color-neutral-700)">19 / 23</div></div>
<div style="margin:10px 20px 0;font-size:12px;line-height:1.45;color:var(--color-neutral-800)">Uncheck anything you already have — it won't be counted.</div>
<div style="padding:12px 20px 0;display:flex;flex-direction:column;gap:12px">
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Beef tacos</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">MON</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Ground beef</span><span style="color:var(--color-neutral-700);font-size:12px">1 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Corn tortillas</span><span style="color:var(--color-neutral-700);font-size:12px">12</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Taco seasoning</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Crock pot tikka masala</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">WED</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Chicken thighs</span><span style="color:var(--color-neutral-700);font-size:12px">2 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Tikka masala paste</span><span style="color:var(--color-neutral-700);font-size:12px">1 jar</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Basmati rice</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Chicken stir-fry</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">THU · 5 items</span></div>
</div>
<div style="position:absolute;left:20px;right:20px;bottom:96px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-accent-2-800)"><svg viewBox="0 0 24 24" width="15" height="15" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>Sent to Google Chat · Sat 8:00 am</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div></div>
</div>
<div style="font-family:var(--font-heading);font-size:26px;color:var(--color-text);margin-top:24px">Round 1 · First purple options</div>
<div id="c0" style="--on-accent:var(--color-text);padding:32px 40px;border-radius:40px;background:var(--color-bg);display:flex;flex-direction:column;gap:20px;color:var(--color-text);font-family:var(--font-body)">
<div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:4px;min-width:280px"><div style="font-family:var(--font-heading);font-size:28px;line-height:1.15;white-space:nowrap">Current (terracotta)</div><div style="font-size:14px;color:var(--color-neutral-800)">For reference — today's Organic palette.</div></div><div style="display:flex;gap:8px"><span style="width:44px;height:44px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent-2);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-divider)"></span></div><div style="display:flex;gap:3px"><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-100)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-200)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-300)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-400)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-500)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-600)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-700)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-800)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-900)"></span></div></div>
<div style="display:flex;gap:28px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Home</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-start">
<div><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Friday, Oct 2</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Tonight's quest</div></div>
<div style="position:relative;width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="19" height="19" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><span style="position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span></div>
</div>
<div style="margin:14px 20px 0;border-radius:32px;background:var(--color-surface);overflow:hidden;display:flex;flex-direction:column">
<div style="height:150px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:2px 18px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px"><div><div style="font-family:var(--font-heading);font-size:22px;line-height:1.1">Pizza night</div><div style="font-size:12px;color:var(--color-neutral-700);margin-top:4px">Regular · 40 min</div></div><div style="height:38px;padding:0 16px;border-radius:999px;background:var(--color-text);color:var(--color-bg);display:flex;align-items:center;font-family:var(--font-heading);font-size:13px">Recipe</div></div>
</div>
<div style="margin:12px 20px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px">
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent);color:var(--on-accent);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Quick dinner</span></div>
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent-2-300);color:var(--color-accent-2-900);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Cook from what I have</span></div>
</div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg><span style="flex:1;font-size:13px;font-weight:700">10 new side quests to swipe</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg><span style="flex:1;font-size:13px;font-weight:700">Shopping list ready · Oct 5–11</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>Home</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Discover</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:8px 20px 0;display:flex;align-items:flex-end;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Discover</div><div style="font-family:var(--font-heading);font-size:30px;line-height:1.1">Side quests</div></div>
<div style="display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--color-accent-2-200);color:var(--color-accent-2-800);font-size:12px;font-weight:700">Quest log · 6</div>
</div>
<div style="position:relative;margin:18px 20px 0;height:440px">
<div style="position:absolute;inset:0;transform:translateY(16px) scale(.9);border-radius:32px;background:var(--color-neutral-300)"></div>
<div style="position:absolute;inset:0;transform:translateY(8px) scale(.95);border-radius:32px;background:var(--color-surface)"></div>
<div style="position:absolute;inset:0;border-radius:32px;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column">
<div style="height:220px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:4px 20px 0;display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:center;justify-content:space-between"><div style="font-family:var(--font-heading);font-size:24px;line-height:1.1">Korean beef bowls</div></div>
<div style="display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-neutral-700)"><span style="display:flex;gap:3px"><span style="width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span></span>Easy</div>
<div style="padding:12px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:13px;line-height:1.45"><b>Why this?</b> You make Chicken stir-fry and Beef tacos most weeks. Same flavors, sweet-savory twist.</div>
</div>
</div>
</div>
<div style="display:flex;justify-content:center;gap:28px;margin-top:22px">
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-neutral-100);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-text)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></div>Pass</div>
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-accent-2-600);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-bg)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path></svg></div>Try it</div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>Discover</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Weekly plan</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;align-items:center;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Week 41</div><div style="font-family:var(--font-heading);font-size:26px;line-height:1.1">Oct 5 – 11</div></div>
<div style="display:flex;gap:6px"><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m15 18-6-6 6-6"></path></svg></div><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div></div>
</div>
<div style="margin:14px 20px 0;padding:10px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:12px;line-height:1.4;display:flex;gap:8px;align-items:center"><svg viewBox="0 0 24 24" width="16" height="16" style="flex:none;fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg><span>5 regulars + 2 side quests · synced to Google Calendar</span></div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:6px">
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">MON<br><span style="font-size:16px;color:var(--color-text)">5</span></div><div style="flex:1;font-weight:700;font-size:14px">Beef tacos</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">TUE<br><span style="font-size:16px;color:var(--color-text)">6</span></div><div style="flex:1;font-weight:700;font-size:14px">Spaghetti bolognese</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">WED<br><span style="font-size:16px;color:var(--color-text)">7</span></div><div style="flex:1;font-weight:700;font-size:14px">Crock pot tikka masala</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">THU<br><span style="font-size:16px;color:var(--color-text)">8</span></div><div style="flex:1;font-weight:700;font-size:14px">Chicken stir-fry</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">FRI<br><span style="font-size:16px;color:var(--color-text)">9</span></div><div style="flex:1;font-weight:700;font-size:14px">Pizza night</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">SAT<br><span style="font-size:16px;color:var(--color-text)">10</span></div><div style="flex:1;font-weight:700;font-size:14px">Korean beef bowls</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">SUN<br><span style="font-size:16px;color:var(--color-text)">11</span></div><div style="flex:1;font-weight:700;font-size:14px">Sheet-pan salmon</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
</div>
<div style="margin:14px 20px 0;height:50px;border-radius:999px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-heading);font-size:15px;color:var(--on-accent)"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg>Shopping list · 23 items</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Shopping list</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-end"><div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Supply run · Oct 5–11</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Shopping list</div></div><div style="font-size:13px;font-weight:700;color:var(--color-neutral-700)">19 / 23</div></div>
<div style="margin:10px 20px 0;font-size:12px;line-height:1.45;color:var(--color-neutral-800)">Uncheck anything you already have — it won't be counted.</div>
<div style="padding:12px 20px 0;display:flex;flex-direction:column;gap:12px">
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Beef tacos</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">MON</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Ground beef</span><span style="color:var(--color-neutral-700);font-size:12px">1 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Corn tortillas</span><span style="color:var(--color-neutral-700);font-size:12px">12</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Taco seasoning</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Crock pot tikka masala</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">WED</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Chicken thighs</span><span style="color:var(--color-neutral-700);font-size:12px">2 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Tikka masala paste</span><span style="color:var(--color-neutral-700);font-size:12px">1 jar</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Basmati rice</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Chicken stir-fry</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">THU · 5 items</span></div>
</div>
<div style="position:absolute;left:20px;right:20px;bottom:96px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-accent-2-800)"><svg viewBox="0 0 24 24" width="15" height="15" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>Sent to Google Chat · Sat 8:00 am</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div></div>
</div>
<div id="c1" style="--color-accent:oklch(0.5 0.13 310);--color-accent-100:oklch(0.97 0.030 310);--color-accent-200:oklch(0.93 0.060 310);--color-accent-300:oklch(0.86 0.090 310);--color-accent-400:oklch(0.77 0.120 310);--color-accent-500:oklch(0.67 0.140 310);--color-accent-600:oklch(0.57 0.140 310);--color-accent-700:oklch(0.47 0.130 310);--color-accent-800:oklch(0.37 0.110 310);--color-accent-900:oklch(0.27 0.080 310);--on-accent:var(--color-bg);padding:32px 40px;border-radius:40px;background:var(--color-bg);display:flex;flex-direction:column;gap:20px;color:var(--color-text);font-family:var(--font-body)">
<div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:4px;min-width:280px"><div style="font-family:var(--font-heading);font-size:28px;line-height:1.15;white-space:nowrap">1 · Plum + sage</div><div style="font-size:14px;color:var(--color-neutral-800)">Recommended. Smallest change; plum and sage pair naturally on the cream ground.</div></div><div style="display:flex;gap:8px"><span style="width:44px;height:44px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent-2);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-divider)"></span></div><div style="display:flex;gap:3px"><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-100)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-200)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-300)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-400)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-500)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-600)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-700)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-800)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-900)"></span></div></div>
<div style="display:flex;gap:28px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Home</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-start">
<div><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Friday, Oct 2</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Tonight's quest</div></div>
<div style="position:relative;width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="19" height="19" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><span style="position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span></div>
</div>
<div style="margin:14px 20px 0;border-radius:32px;background:var(--color-surface);overflow:hidden;display:flex;flex-direction:column">
<div style="height:150px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:2px 18px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px"><div><div style="font-family:var(--font-heading);font-size:22px;line-height:1.1">Pizza night</div><div style="font-size:12px;color:var(--color-neutral-700);margin-top:4px">Regular · 40 min</div></div><div style="height:38px;padding:0 16px;border-radius:999px;background:var(--color-text);color:var(--color-bg);display:flex;align-items:center;font-family:var(--font-heading);font-size:13px">Recipe</div></div>
</div>
<div style="margin:12px 20px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px">
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent);color:var(--on-accent);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Quick dinner</span></div>
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent-2-300);color:var(--color-accent-2-900);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Cook from what I have</span></div>
</div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg><span style="flex:1;font-size:13px;font-weight:700">10 new side quests to swipe</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg><span style="flex:1;font-size:13px;font-weight:700">Shopping list ready · Oct 5–11</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>Home</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Discover</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:8px 20px 0;display:flex;align-items:flex-end;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Discover</div><div style="font-family:var(--font-heading);font-size:30px;line-height:1.1">Side quests</div></div>
<div style="display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--color-accent-2-200);color:var(--color-accent-2-800);font-size:12px;font-weight:700">Quest log · 6</div>
</div>
<div style="position:relative;margin:18px 20px 0;height:440px">
<div style="position:absolute;inset:0;transform:translateY(16px) scale(.9);border-radius:32px;background:var(--color-neutral-300)"></div>
<div style="position:absolute;inset:0;transform:translateY(8px) scale(.95);border-radius:32px;background:var(--color-surface)"></div>
<div style="position:absolute;inset:0;border-radius:32px;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column">
<div style="height:220px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:4px 20px 0;display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:center;justify-content:space-between"><div style="font-family:var(--font-heading);font-size:24px;line-height:1.1">Korean beef bowls</div></div>
<div style="display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-neutral-700)"><span style="display:flex;gap:3px"><span style="width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span></span>Easy</div>
<div style="padding:12px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:13px;line-height:1.45"><b>Why this?</b> You make Chicken stir-fry and Beef tacos most weeks. Same flavors, sweet-savory twist.</div>
</div>
</div>
</div>
<div style="display:flex;justify-content:center;gap:28px;margin-top:22px">
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-neutral-100);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-text)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></div>Pass</div>
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-accent-2-600);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-bg)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path></svg></div>Try it</div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>Discover</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Weekly plan</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;align-items:center;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Week 41</div><div style="font-family:var(--font-heading);font-size:26px;line-height:1.1">Oct 5 – 11</div></div>
<div style="display:flex;gap:6px"><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m15 18-6-6 6-6"></path></svg></div><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div></div>
</div>
<div style="margin:14px 20px 0;padding:10px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:12px;line-height:1.4;display:flex;gap:8px;align-items:center"><svg viewBox="0 0 24 24" width="16" height="16" style="flex:none;fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg><span>5 regulars + 2 side quests · synced to Google Calendar</span></div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:6px">
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">MON<br><span style="font-size:16px;color:var(--color-text)">5</span></div><div style="flex:1;font-weight:700;font-size:14px">Beef tacos</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">TUE<br><span style="font-size:16px;color:var(--color-text)">6</span></div><div style="flex:1;font-weight:700;font-size:14px">Spaghetti bolognese</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">WED<br><span style="font-size:16px;color:var(--color-text)">7</span></div><div style="flex:1;font-weight:700;font-size:14px">Crock pot tikka masala</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">THU<br><span style="font-size:16px;color:var(--color-text)">8</span></div><div style="flex:1;font-weight:700;font-size:14px">Chicken stir-fry</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">FRI<br><span style="font-size:16px;color:var(--color-text)">9</span></div><div style="flex:1;font-weight:700;font-size:14px">Pizza night</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">SAT<br><span style="font-size:16px;color:var(--color-text)">10</span></div><div style="flex:1;font-weight:700;font-size:14px">Korean beef bowls</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">SUN<br><span style="font-size:16px;color:var(--color-text)">11</span></div><div style="flex:1;font-weight:700;font-size:14px">Sheet-pan salmon</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
</div>
<div style="margin:14px 20px 0;height:50px;border-radius:999px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-heading);font-size:15px;color:var(--on-accent)"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg>Shopping list · 23 items</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Shopping list</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-end"><div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Supply run · Oct 5–11</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Shopping list</div></div><div style="font-size:13px;font-weight:700;color:var(--color-neutral-700)">19 / 23</div></div>
<div style="margin:10px 20px 0;font-size:12px;line-height:1.45;color:var(--color-neutral-800)">Uncheck anything you already have — it won't be counted.</div>
<div style="padding:12px 20px 0;display:flex;flex-direction:column;gap:12px">
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Beef tacos</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">MON</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Ground beef</span><span style="color:var(--color-neutral-700);font-size:12px">1 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Corn tortillas</span><span style="color:var(--color-neutral-700);font-size:12px">12</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Taco seasoning</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Crock pot tikka masala</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">WED</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Chicken thighs</span><span style="color:var(--color-neutral-700);font-size:12px">2 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Tikka masala paste</span><span style="color:var(--color-neutral-700);font-size:12px">1 jar</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Basmati rice</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Chicken stir-fry</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">THU · 5 items</span></div>
</div>
<div style="position:absolute;left:20px;right:20px;bottom:96px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-accent-2-800)"><svg viewBox="0 0 24 24" width="15" height="15" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>Sent to Google Chat · Sat 8:00 am</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div></div>
</div>
<div id="c2" style="--color-bg:oklch(0.975 0.008 85);--color-surface:oklch(0.935 0.016 85);--color-accent:oklch(0.5 0.13 310);--color-accent-100:oklch(0.97 0.030 310);--color-accent-200:oklch(0.93 0.060 310);--color-accent-300:oklch(0.86 0.090 310);--color-accent-400:oklch(0.77 0.120 310);--color-accent-500:oklch(0.67 0.140 310);--color-accent-600:oklch(0.57 0.140 310);--color-accent-700:oklch(0.47 0.130 310);--color-accent-800:oklch(0.37 0.110 310);--color-accent-900:oklch(0.27 0.080 310);--color-accent-2:oklch(0.76 0.14 78);--color-accent-2-100:oklch(0.97 0.030 78);--color-accent-2-200:oklch(0.93 0.060 78);--color-accent-2-300:oklch(0.86 0.090 78);--color-accent-2-400:oklch(0.77 0.120 78);--color-accent-2-500:oklch(0.67 0.140 78);--color-accent-2-600:oklch(0.57 0.140 78);--color-accent-2-700:oklch(0.47 0.130 78);--color-accent-2-800:oklch(0.37 0.110 78);--color-accent-2-900:oklch(0.27 0.080 78);--on-accent:var(--color-bg);padding:32px 40px;border-radius:40px;background:var(--color-bg);display:flex;flex-direction:column;gap:20px;color:var(--color-text);font-family:var(--font-body)">
<div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:4px;min-width:280px"><div style="font-family:var(--font-heading);font-size:28px;line-height:1.15;white-space:nowrap">2 · Plum + marigold</div><div style="font-size:14px;color:var(--color-neutral-800)">Brighter and more playful. Ground moves to a softer off-white.</div></div><div style="display:flex;gap:8px"><span style="width:44px;height:44px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent-2);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-divider)"></span></div><div style="display:flex;gap:3px"><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-100)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-200)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-300)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-400)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-500)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-600)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-700)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-800)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-900)"></span></div></div>
<div style="display:flex;gap:28px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Home</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-start">
<div><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Friday, Oct 2</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Tonight's quest</div></div>
<div style="position:relative;width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="19" height="19" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><span style="position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span></div>
</div>
<div style="margin:14px 20px 0;border-radius:32px;background:var(--color-surface);overflow:hidden;display:flex;flex-direction:column">
<div style="height:150px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:2px 18px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px"><div><div style="font-family:var(--font-heading);font-size:22px;line-height:1.1">Pizza night</div><div style="font-size:12px;color:var(--color-neutral-700);margin-top:4px">Regular · 40 min</div></div><div style="height:38px;padding:0 16px;border-radius:999px;background:var(--color-text);color:var(--color-bg);display:flex;align-items:center;font-family:var(--font-heading);font-size:13px">Recipe</div></div>
</div>
<div style="margin:12px 20px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px">
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent);color:var(--on-accent);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Quick dinner</span></div>
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent-2-300);color:var(--color-accent-2-900);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Cook from what I have</span></div>
</div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg><span style="flex:1;font-size:13px;font-weight:700">10 new side quests to swipe</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg><span style="flex:1;font-size:13px;font-weight:700">Shopping list ready · Oct 5–11</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>Home</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Discover</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:8px 20px 0;display:flex;align-items:flex-end;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Discover</div><div style="font-family:var(--font-heading);font-size:30px;line-height:1.1">Side quests</div></div>
<div style="display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--color-accent-2-200);color:var(--color-accent-2-800);font-size:12px;font-weight:700">Quest log · 6</div>
</div>
<div style="position:relative;margin:18px 20px 0;height:440px">
<div style="position:absolute;inset:0;transform:translateY(16px) scale(.9);border-radius:32px;background:var(--color-neutral-300)"></div>
<div style="position:absolute;inset:0;transform:translateY(8px) scale(.95);border-radius:32px;background:var(--color-surface)"></div>
<div style="position:absolute;inset:0;border-radius:32px;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column">
<div style="height:220px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:4px 20px 0;display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:center;justify-content:space-between"><div style="font-family:var(--font-heading);font-size:24px;line-height:1.1">Korean beef bowls</div></div>
<div style="display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-neutral-700)"><span style="display:flex;gap:3px"><span style="width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span></span>Easy</div>
<div style="padding:12px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:13px;line-height:1.45"><b>Why this?</b> You make Chicken stir-fry and Beef tacos most weeks. Same flavors, sweet-savory twist.</div>
</div>
</div>
</div>
<div style="display:flex;justify-content:center;gap:28px;margin-top:22px">
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-neutral-100);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-text)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></div>Pass</div>
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-accent-2-600);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-bg)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path></svg></div>Try it</div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>Discover</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Weekly plan</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;align-items:center;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Week 41</div><div style="font-family:var(--font-heading);font-size:26px;line-height:1.1">Oct 5 – 11</div></div>
<div style="display:flex;gap:6px"><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m15 18-6-6 6-6"></path></svg></div><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div></div>
</div>
<div style="margin:14px 20px 0;padding:10px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:12px;line-height:1.4;display:flex;gap:8px;align-items:center"><svg viewBox="0 0 24 24" width="16" height="16" style="flex:none;fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg><span>5 regulars + 2 side quests · synced to Google Calendar</span></div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:6px">
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">MON<br><span style="font-size:16px;color:var(--color-text)">5</span></div><div style="flex:1;font-weight:700;font-size:14px">Beef tacos</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">TUE<br><span style="font-size:16px;color:var(--color-text)">6</span></div><div style="flex:1;font-weight:700;font-size:14px">Spaghetti bolognese</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">WED<br><span style="font-size:16px;color:var(--color-text)">7</span></div><div style="flex:1;font-weight:700;font-size:14px">Crock pot tikka masala</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">THU<br><span style="font-size:16px;color:var(--color-text)">8</span></div><div style="flex:1;font-weight:700;font-size:14px">Chicken stir-fry</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">FRI<br><span style="font-size:16px;color:var(--color-text)">9</span></div><div style="flex:1;font-weight:700;font-size:14px">Pizza night</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">SAT<br><span style="font-size:16px;color:var(--color-text)">10</span></div><div style="flex:1;font-weight:700;font-size:14px">Korean beef bowls</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">SUN<br><span style="font-size:16px;color:var(--color-text)">11</span></div><div style="flex:1;font-weight:700;font-size:14px">Sheet-pan salmon</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
</div>
<div style="margin:14px 20px 0;height:50px;border-radius:999px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-heading);font-size:15px;color:var(--on-accent)"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg>Shopping list · 23 items</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Shopping list</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-end"><div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Supply run · Oct 5–11</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Shopping list</div></div><div style="font-size:13px;font-weight:700;color:var(--color-neutral-700)">19 / 23</div></div>
<div style="margin:10px 20px 0;font-size:12px;line-height:1.45;color:var(--color-neutral-800)">Uncheck anything you already have — it won't be counted.</div>
<div style="padding:12px 20px 0;display:flex;flex-direction:column;gap:12px">
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Beef tacos</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">MON</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Ground beef</span><span style="color:var(--color-neutral-700);font-size:12px">1 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Corn tortillas</span><span style="color:var(--color-neutral-700);font-size:12px">12</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Taco seasoning</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Crock pot tikka masala</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">WED</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Chicken thighs</span><span style="color:var(--color-neutral-700);font-size:12px">2 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Tikka masala paste</span><span style="color:var(--color-neutral-700);font-size:12px">1 jar</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Basmati rice</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Chicken stir-fry</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">THU · 5 items</span></div>
</div>
<div style="position:absolute;left:20px;right:20px;bottom:96px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-accent-2-800)"><svg viewBox="0 0 24 24" width="15" height="15" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>Sent to Google Chat · Sat 8:00 am</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div></div>
</div>
<div id="c3" style="--color-accent:oklch(0.42 0.14 300);--color-accent-100:oklch(0.97 0.032 300);--color-accent-200:oklch(0.93 0.063 300);--color-accent-300:oklch(0.86 0.095 300);--color-accent-400:oklch(0.77 0.126 300);--color-accent-500:oklch(0.67 0.147 300);--color-accent-600:oklch(0.57 0.147 300);--color-accent-700:oklch(0.47 0.137 300);--color-accent-800:oklch(0.37 0.116 300);--color-accent-900:oklch(0.27 0.084 300);--color-accent-2:#c67139;--color-accent-2-100:#fff2eb;--color-accent-2-200:#ffe1d0;--color-accent-2-300:#ffc6a5;--color-accent-2-400:#f6a06b;--color-accent-2-500:#d67f48;--color-accent-2-600:#b2622d;--color-accent-2-700:#8c491a;--color-accent-2-800:#643312;--color-accent-2-900:#402310;--on-accent:var(--color-bg);padding:32px 40px;border-radius:40px;background:var(--color-bg);display:flex;flex-direction:column;gap:20px;color:var(--color-text);font-family:var(--font-body)">
<div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:4px;min-width:280px"><div style="font-family:var(--font-heading);font-size:28px;line-height:1.15;white-space:nowrap">3 · Grape + terracotta</div><div style="font-size:14px;color:var(--color-neutral-800)">Deepest and richest; terracotta becomes the second voice.</div></div><div style="display:flex;gap:8px"><span style="width:44px;height:44px;border-radius:50%;background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-accent-2);box-shadow:inset 0 0 0 1px var(--color-divider)"></span><span style="width:44px;height:44px;border-radius:50%;background:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-divider)"></span></div><div style="display:flex;gap:3px"><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-100)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-200)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-300)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-400)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-500)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-600)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-700)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-800)"></span><span style="width:22px;height:44px;border-radius:999px;background:var(--color-accent-900)"></span></div></div>
<div style="display:flex;gap:28px;flex-wrap:wrap"><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Home</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-start">
<div><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Friday, Oct 2</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Tonight's quest</div></div>
<div style="position:relative;width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="19" height="19" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><span style="position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span></div>
</div>
<div style="margin:14px 20px 0;border-radius:32px;background:var(--color-surface);overflow:hidden;display:flex;flex-direction:column">
<div style="height:150px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:2px 18px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px"><div><div style="font-family:var(--font-heading);font-size:22px;line-height:1.1">Pizza night</div><div style="font-size:12px;color:var(--color-neutral-700);margin-top:4px">Regular · 40 min</div></div><div style="height:38px;padding:0 16px;border-radius:999px;background:var(--color-text);color:var(--color-bg);display:flex;align-items:center;font-family:var(--font-heading);font-size:13px">Recipe</div></div>
</div>
<div style="margin:12px 20px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px">
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent);color:var(--on-accent);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Quick dinner</span></div>
<div style="height:104px;padding:14px;border-radius:26px;background:var(--color-accent-2-300);color:var(--color-accent-2-900);display:flex;flex-direction:column;justify-content:space-between"><svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg><span style="font-family:var(--font-heading);font-size:16px;line-height:1.1">Cook from what I have</span></div>
</div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg><span style="flex:1;font-size:13px;font-weight:700">10 new side quests to swipe</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--color-neutral-100)"><svg viewBox="0 0 24 24" width="18" height="18" style="color:var(--color-accent-700);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg><span style="flex:1;font-size:13px;font-weight:700">Shopping list ready · Oct 5–11</span><svg viewBox="0 0 24 24" width="16" height="16" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>Home</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Discover</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:8px 20px 0;display:flex;align-items:flex-end;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Discover</div><div style="font-family:var(--font-heading);font-size:30px;line-height:1.1">Side quests</div></div>
<div style="display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--color-accent-2-200);color:var(--color-accent-2-800);font-size:12px;font-weight:700">Quest log · 6</div>
</div>
<div style="position:relative;margin:18px 20px 0;height:440px">
<div style="position:absolute;inset:0;transform:translateY(16px) scale(.9);border-radius:32px;background:var(--color-neutral-300)"></div>
<div style="position:absolute;inset:0;transform:translateY(8px) scale(.95);border-radius:32px;background:var(--color-surface)"></div>
<div style="position:absolute;inset:0;border-radius:32px;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column">
<div style="height:220px;margin:10px;border-radius:24px;background:repeating-linear-gradient(135deg,var(--color-neutral-300) 0 8px,var(--color-neutral-200) 8px 16px);display:flex;align-items:center;justify-content:center;font:11px ui-monospace,Menlo,monospace;color:var(--color-neutral-700)">dish photo</div>
<div style="padding:4px 20px 0;display:flex;flex-direction:column;gap:10px">
<div style="display:flex;align-items:center;justify-content:space-between"><div style="font-family:var(--font-heading);font-size:24px;line-height:1.1">Korean beef bowls</div></div>
<div style="display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-neutral-700)"><span style="display:flex;gap:3px"><span style="width:8px;height:8px;border-radius:50%;background:var(--color-accent);color:var(--on-accent)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span><span style="width:8px;height:8px;border-radius:50%;background:var(--color-neutral-300)"></span></span>Easy</div>
<div style="padding:12px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:13px;line-height:1.45"><b>Why this?</b> You make Chicken stir-fry and Beef tacos most weeks. Same flavors, sweet-savory twist.</div>
</div>
</div>
</div>
<div style="display:flex;justify-content:center;gap:28px;margin-top:22px">
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-neutral-100);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-text)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></div>Pass</div>
<div style="display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--color-neutral-700)"><div style="width:62px;height:62px;border-radius:50%;background:var(--color-accent-2-600);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;color:var(--color-bg)"><svg viewBox="0 0 24 24" width="26" height="26" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path></svg></div>Try it</div>
</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>Discover</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Weekly plan</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;align-items:center;justify-content:space-between">
<div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Week 41</div><div style="font-family:var(--font-heading);font-size:26px;line-height:1.1">Oct 5 – 11</div></div>
<div style="display:flex;gap:6px"><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m15 18-6-6 6-6"></path></svg></div><div style="width:36px;height:36px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="m9 18 6-6-6-6"></path></svg></div></div>
</div>
<div style="margin:14px 20px 0;padding:10px 14px;border-radius:18px;background:var(--color-accent-2-100);color:var(--color-accent-2-900);font-size:12px;line-height:1.4;display:flex;gap:8px;align-items:center"><svg viewBox="0 0 24 24" width="16" height="16" style="flex:none;fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg><span>5 regulars + 2 side quests · synced to Google Calendar</span></div>
<div style="margin:12px 20px 0;display:flex;flex-direction:column;gap:6px">
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">MON<br><span style="font-size:16px;color:var(--color-text)">5</span></div><div style="flex:1;font-weight:700;font-size:14px">Beef tacos</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">TUE<br><span style="font-size:16px;color:var(--color-text)">6</span></div><div style="flex:1;font-weight:700;font-size:14px">Spaghetti bolognese</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">WED<br><span style="font-size:16px;color:var(--color-text)">7</span></div><div style="flex:1;font-weight:700;font-size:14px">Crock pot tikka masala</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">THU<br><span style="font-size:16px;color:var(--color-text)">8</span></div><div style="flex:1;font-weight:700;font-size:14px">Chicken stir-fry</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">FRI<br><span style="font-size:16px;color:var(--color-text)">9</span></div><div style="flex:1;font-weight:700;font-size:14px">Pizza night</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-accent-100);box-shadow:inset 0 0 0 1.5px var(--color-accent-300)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-accent-700);line-height:1.1">SAT<br><span style="font-size:16px;color:var(--color-text)">10</span></div><div style="flex:1;font-weight:700;font-size:14px">Korean beef bowls</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-accent-200);color:var(--color-accent-800);font-size:10px;font-weight:700">Side quest</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
<div style="display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:18px;background:var(--color-surface)"><div style="width:36px;text-align:center;font-size:11px;font-weight:700;color:var(--color-neutral-700);line-height:1.1">SUN<br><span style="font-size:16px;color:var(--color-text)">11</span></div><div style="flex:1;font-weight:700;font-size:14px">Sheet-pan salmon</div><span style="padding:3px 9px;border-radius:999px;background:var(--color-neutral-100);color:var(--color-neutral-800);font-size:10px;font-weight:700">Regular</span><svg viewBox="0 0 24 24" width="16" height="16" style="color:var(--color-neutral-600);fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"></path><path d="M8 16H3v5"></path></svg></div>
</div>
<div style="margin:14px 20px 0;height:50px;border-radius:999px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-heading);font-size:15px;color:var(--on-accent)"><svg viewBox="0 0 24 24" width="18" height="18" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="8" cy="21" r="1"></circle><circle cx="19" cy="21" r="1"></circle><path d="M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12"></path></svg>Shopping list · 23 items</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div><div style="display:flex;flex-direction:column;gap:8px"><div style="font-size:12px;font-weight:700;color:var(--color-neutral-700)">Shopping list</div><div style="width:360px;height:760px;position:relative;border-radius:36px;background:var(--color-bg);overflow:hidden;box-shadow:var(--shadow-md)">
<div style="height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;font-weight:700"><span>9:41</span><span style="width:22px;height:10px;border-radius:3px;background:var(--color-text)"></span></div>
<div style="padding:6px 20px 0;display:flex;justify-content:space-between;align-items:flex-end"><div><div style="font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700)">Supply run · Oct 5–11</div><div style="font-family:var(--font-heading);font-size:28px;line-height:1.1">Shopping list</div></div><div style="font-size:13px;font-weight:700;color:var(--color-neutral-700)">19 / 23</div></div>
<div style="margin:10px 20px 0;font-size:12px;line-height:1.45;color:var(--color-neutral-800)">Uncheck anything you already have — it won't be counted.</div>
<div style="padding:12px 20px 0;display:flex;flex-direction:column;gap:12px">
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Beef tacos</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">MON</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Ground beef</span><span style="color:var(--color-neutral-700);font-size:12px">1 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Corn tortillas</span><span style="color:var(--color-neutral-700);font-size:12px">12</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Taco seasoning</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;flex-direction:column;gap:9px">
<div style="display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Crock pot tikka masala</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">WED</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Chicken thighs</span><span style="color:var(--color-neutral-700);font-size:12px">2 lb</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px"><span style="width:20px;height:20px;border-radius:7px;background:var(--color-accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center"><svg viewBox="0 0 24 24" width="13" height="13" style="fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round"><path d="M20 6 9 17l-5-5"></path></svg></span><span style="flex:1">Tikka masala paste</span><span style="color:var(--color-neutral-700);font-size:12px">1 jar</span></div>
<div style="display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-neutral-600)"><span style="width:20px;height:20px;border-radius:7px;border:2px solid var(--color-neutral-400)"></span><span style="flex:1;text-decoration:line-through">Basmati rice</span><span style="font-size:11px;font-weight:700">have it</span></div>
</div>
<div style="padding:14px;border-radius:24px;background:var(--color-surface);display:flex;justify-content:space-between;align-items:baseline"><span style="font-family:var(--font-heading);font-size:16px">Chicken stir-fry</span><span style="font-size:11px;font-weight:700;color:var(--color-neutral-700)">THU · 5 items</span></div>
</div>
<div style="position:absolute;left:20px;right:20px;bottom:96px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--color-accent-2-800)"><svg viewBox="0 0 24 24" width="15" height="15" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>Sent to Google Chat · Sat 8:00 am</div>
<div style="position:absolute;left:14px;right:14px;bottom:16px;height:62px;border-radius:999px;background:var(--color-text);display:flex;align-items:center;justify-content:space-around;color:var(--color-neutral-400)">
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<div style="display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;background:var(--color-accent);color:var(--on-accent);font-size:13px;font-weight:700"><svg viewBox="0 0 24 24" width="20" height="20" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Plan</div>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<svg viewBox="0 0 24 24" width="22" height="22" style="fill:none;stroke:currentColor;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round"><path d="M10 5H3"></path><path d="M12 19H3"></path><path d="M14 3v4"></path><path d="M16 17v4"></path><path d="M21 12h-9"></path><path d="M21 19h-5"></path><path d="M21 5h-7"></path><path d="M8 10v4"></path><path d="M8 12H3"></path></svg>
</div>
</div></div></div>
</div>
</div>
</x-dc>
</body>
</html>