bloby-bot 0.51.4 → 0.52.0

package/workspace/skills/mac/SKILL.md

@@ -0,0 +1,302 @@
+# Mac (Morphy notch)
+
+## What This Is
+
+A channel for replying to your human **on their Mac**, through the **Morphy companion app** that lives in the MacBook notch. You speak a short reply (TTS) and *optionally* push a small HTML+CSS card into the notch — same beat as the audio. No pull, no schedule, no state to maintain. Pure output channel.
+
+The notch's bottom slot is rendered with a sandboxed `WKWebView`. You're not building a webpage; you're hand-rolling a single ~9.4 cm² glance card.
+
+---
+
+## When To Use This Skill
+
+Activate when the **user message starts with `[Mac]`**. Don't apply it to other inbound traffic (WhatsApp, Alexa, web chat). Specifically:
+
+- `[Mac] what's on my calendar today?` → activate
+- `[Mac] what time is it in Tokyo?` → activate
+- `what's on my calendar today?` (no tag) → ignore this skill, reply as usual
+
+The tag is injected by the Morphy app itself when the human pushes-to-talk through Morphy, so by the time you see `[Mac]` it means **your reply will be spoken back at them**. Optimize for the ear, supplement with the eye.
+
+---
+
+## Two ways to put a visual in the notch
+
+There are **two** ways to render a card. Reach for them in this order:
+
+1. **Preset (preferred).** Morphy ships a library of beautiful, pre-built card
+   renderers (`email`, `calendar`, `list`, `text`, `weather`, `ticker`, `stat`,
+   `info`, `comparison`). You send only **structured data** — never CSS — and
+   Morphy lays it out perfectly, on-brand, with scrolling handled for you. It's
+   the fast, pretty, low-token path. **Full data schemas + examples:
+   [`presets/PRESETS.md`](presets/PRESETS.md).**
+
+   ```
+   <notch_card type="email">
+   { "from": "Alex Chen", "subject": "Migration plan", "time": "2:14 PM",
+     "body": "Can we move the cutover to Tuesday?\n\nStaging looked clean." }
+   </notch_card>
+   ```
+
+2. **Custom (escape hatch).** When no preset fits the shape of the answer,
+   hand-write the whole card in `<notch_html>…</notch_html>` (rules below). Cards
+   you hand-build and reuse get saved to `frequentSnippets/` so next time is
+   copy-fill-send. If a custom card gets requested a lot, tell Bruno — it's a
+   candidate to become a real shipped preset.
+
+**Check for a preset first.** Only drop to custom HTML when the data genuinely
+doesn't fit one of the presets.
+
+> **Long prose / "read me this" / a summary / an explanation → use the `text`
+> preset.** Do NOT dump raw paragraphs into `<notch_html>` — that tag is *HTML*,
+> not a text box. Bare text there renders unstyled, edge-to-edge, with no padding.
+> The `text` preset gives you a title, proper margins, and a scrollable body for
+> free: `<notch_card type="text">{ "title": "…", "body": "…long text with \n\n…" }</notch_card>`.
+> `<notch_html>` is only for a genuinely custom *visual layout* you hand-build with
+> real markup and inline styles — never as a dumping ground for plain text.
+
+## Output Format
+
+Your full reply lives inside the conversation; Morphy will:
+
+1. Strip any `<notch_card …>…</notch_card>` **and** `<notch_html>…</notch_html>`
+   block before TTS — neither is **ever** spoken.
+2. Send the remaining text to ElevenLabs and play it through the Mac.
+3. Render the card (preset → Morphy's renderer; custom → your HTML) and auto-open
+   the notch downward **at the same moment** the audio starts. Visual + audio land
+   together — that's the whole point.
+
+So a reply has up to two parts — a spoken sentence and **one** card block (either
+a `<notch_card>` preset or a `<notch_html>` custom card, not both):
+
+```
+<concise spoken sentence>
+<notch_card type="…">{ …data… }</notch_card>
+```
+
+### Spoken text rules
+
+- **One or two sentences max.** It's audio, not prose. The human is mid-task when this plays — don't make them stand still for a paragraph.
+- **No markdown, no bullet lists, no enumerations.** TTS reads symbols literally and it sounds awful.
+- **Refer the human by name** if you know it ("Here's your calendar for today, Bruno.") — sounds personal, doesn't add length.
+- **Acknowledge the card when you send one.** Otherwise the visual feels disconnected from the voice. "Here it is.", "I put the details up top.", "Tap to glance.".
+
+### 🚫 The #1 mistake: speaking the card content out loud
+
+**This is the single most common failure mode and it ruins the UX.** If your card contains a list, a calendar, an email digest, news headlines, search results — *anything structured* — your spoken text **must NOT re-read those items**. The human is already looking at them. Reading them aloud doubles the time-to-information and makes Morphy feel broken.
+
+When the card carries the answer, the voice's only job is the **lead-in sentence** — and then stop talking.
+
+#### ❌ BAD — speaks the card back at the human
+
+> *"Top five AI today, Bruno. Anthropic dropped Claude Opus 4.7 with a one-million-token window. OpenAI is rolling Sora 3 video into ChatGPT for Plus users. Meta open-sourced Llama 4 Scout at 400 billion params. Google DeepMind's Gemini 3 hit number one on the LMSys arena. And Mistral closed a five billion dollar round at a forty billion valuation."*
+> ```
+> <notch_html>… the same five items rendered as a list …</notch_html>
+> ```
+
+ElevenLabs spends 30+ seconds reciting what's already on screen. The human paid for tokens AND TTS minutes to receive identical information twice. Don't do this.
+
+#### ✓ GOOD — lead-in only, card carries the detail
+
+> *"Here are today's top five in AI, Bruno."*
+> ```
+> <notch_html>… the same five items rendered as a list …</notch_html>
+> ```
+
+Two seconds of speech, the eye picks up the rest, human keeps working.
+
+#### Same rule, different shapes
+
+| Question | Speech | Card |
+|---|---|---|
+| "What's on my calendar today?" | *"Here's your day, Bruno."* | day + events |
+| "Read me my unread emails." | *"Three worth a glance, Bruno."* | sender + subject list |
+| "Compare Postgres vs SQLite." | *"Quick side-by-side up top, Bruno."* | two-column card |
+| "What's the weather?" | *"Pinned the forecast for you, Bruno."* | temp + conditions |
+| "What time is it in Tokyo?" | *"It's 8:14 PM in Tokyo."* | **no card** — bare fact, voice is enough |
+
+The rule is symmetric: if the **voice alone** is the right answer, send **no card**. If the **card** is the answer, send a **short lead-in** in voice. **Never both at full length.**
+
+### Whether to send a card at all
+
+- **Sometimes useful, sometimes not.** Decide per reply. A time-of-day answer doesn't need a card. A calendar, a list, a comparison, a status — those benefit from one.
+- **Preset first.** If the answer is an email, a list, a calendar, a stat, a comparison, a quote/summary, weather, or a quote — there's almost certainly a preset for it (see [`presets/PRESETS.md`](presets/PRESETS.md)). Send data, not markup.
+- **Custom only when nothing fits.** Reach for `<notch_html>` when the shape is genuinely bespoke. Pin reusable custom cards as files in `frequentSnippets/` so you can copy-swap-send instead of regenerating.
+- **The card is display-only — but scrollable.** Don't put buttons, links, or "click to expand" — clicks do nothing and read as broken UI. But long content **is scrollable**: the user scrolls `email` / `list` / `calendar` / `text` cards with the trackpad (a thin scrollbar appears), so it's fine to let content overflow.
+
+---
+
+## The Canvas
+
+| Constraint | Value |
+|---|---|
+| **Width** | **383 points** (fixed) |
+| **Height** | **~147 points** (fixed; bottom is inset to clear the pill's rounded corners) |
+| **Background** | **Transparent**. Sits directly on a **black** pill. Plan accordingly — black is your canvas. |
+| **Font** | System (`-apple-system, BlinkMacSystemFont, system-ui`) is preloaded. Override only if you need a monospaced number or display weight. |
+| **Color** | White or light. Use `rgba(255,255,255,0.x)` for tints — opacity tints read better than gray on black. |
+| **Allowed** | HTML, CSS (incl. flexbox, grid, gradients, transitions, animations), unicode glyphs / emoji. |
+| **Forbidden** | JS that does network or file access, `<img src="https://...">`, `<iframe>`, anything that loads external resources. The view has no network. |
+| **Interactivity** | No clicks or hovers — they do nothing. But long content **scrolls** via the trackpad (a thin scrollbar appears), so overflow is fine. |
+
+**383 × 147 is small.** Roughly the size of two stacked Spotlight rows. Treat each card as a single coherent idea — date + time, one event, one fact, one comparison. If you can't fit it, paginate via speech ("here's the first, ask 'next' for the rest"), don't shrink the type.
+
+### Space tips
+
+- **Two-column grids** with `display: flex; gap: 8px` are very effective at ~190pt per column.
+- **A divider line** (`rgba(255,255,255,0.08)`, 1px) under a header separates regions without visually crowding.
+- **Tabs / pagination** can be visual-only (a row of dots indicating "1 of 3"); say "next" in the audio and resend a fresh snippet for page 2.
+- **Don't outline the card.** The black pill is already the frame.
+- **12–14px is the smallest comfortable size** on a Retina notch. Below that, antialiasing makes white text on black smear.
+
+---
+
+## Frequent Snippets
+
+`workspace/skills/mac/frequentSnippets/*.html` — pre-built cards. When your human asks something you've answered before, **don't regenerate** the markup. Read the file, replace placeholders, paste into `<notch_html>…</notch_html>`. Saves tokens, lowers latency, lets the visual feel land at the same beat as the voice.
+
+**Workflow:**
+
+1. First time the human asks "what's on my calendar today?" — generate a card from scratch, show it, ask: *"Want me to save this as a template for next time?"*
+2. If yes, write it to `frequentSnippets/calendar-today.html` with `{{placeholders}}` for the dynamic bits.
+3. Next time the same question comes in, `Read` the file, do a simple string-replace on the placeholders, paste the result into `<notch_html>…</notch_html>`.
+
+Use `{{double_curly}}` placeholders so they're easy to grep and unambiguous. Keep file names kebab-cased and intent-named (`calendar-today.html`, `weather-now.html`, `pomodoro-status.html`).
+
+Starter snippets in this skill (read them to see the style):
+
+- `frequentSnippets/calendar-today.html` — day + date hero, event list, "no events" empty state.
+- `frequentSnippets/info-card.html` — two-column key/value card.
+- `frequentSnippets/single-stat.html` — one big number, one supporting line.
+
+You're encouraged to **discuss the snippet design with your human** — they see it every day, they'll have opinions on density, accent color, what to lead with. Keep the file in sync with what they tell you. Treat each `.html` as a small product surface.
+
+---
+
+## Examples
+
+### Example 1 — Calendar (with card)
+
+> **Human:** `[Mac] what's on my calendar today?`
+> **You (full reply):**
+> ```
+> Here's your day, Bruno. Stand-up at 10, design review at 2, nothing after 4.
+> <notch_html>
+> <div style="padding:12px 16px;display:flex;flex-direction:column;gap:8px;height:100%;box-sizing:border-box">
+>   <div style="display:flex;align-items:baseline;gap:8px">
+>     <div style="font-size:22px;font-weight:700">Thu</div>
+>     <div style="font-size:13px;opacity:0.55">May 28</div>
+>   </div>
+>   <div style="height:1px;background:rgba(255,255,255,0.08)"></div>
+>   <div style="display:flex;justify-content:space-between;font-size:11px">
+>     <span style="opacity:0.7">10:00 · Stand-up</span>
+>     <span style="opacity:0.4">30m</span>
+>   </div>
+>   <div style="display:flex;justify-content:space-between;font-size:11px">
+>     <span style="opacity:0.7">14:00 · Design review</span>
+>     <span style="opacity:0.4">1h</span>
+>   </div>
+> </div>
+> </notch_html>
+> ```
+
+Morphy speaks "Here's your day, Bruno…" while the card slides into the notch.
+
+### Example 2 — Quick fact (no card)
+
+> **Human:** `[Mac] what time is it in Tokyo?`
+> **You (full reply):**
+> ```
+> It's 8:14 PM in Tokyo.
+> ```
+
+A bare fact doesn't earn screen real estate. Speak it, move on.
+
+### Example 3 — Comparison (card with two columns)
+
+> **Human:** `[Mac] which is better for our use case, Postgres or SQLite?`
+> **You:**
+> ```
+> For your use case, Bruno, Postgres edges it out for the concurrent writes. Quick side-by-side up top.
+> <notch_html>
+> <div style="padding:12px 16px;display:flex;gap:10px;height:100%;box-sizing:border-box">
+>   <div style="flex:1;padding:8px 10px;border-radius:8px;background:rgba(255,255,255,0.05)">
+>     <div style="font-size:10px;opacity:0.5;text-transform:uppercase;letter-spacing:.5px">Postgres</div>
+>     <div style="font-size:13px;font-weight:700;margin-top:2px">Concurrent ✓</div>
+>     <div style="font-size:10px;opacity:0.5;margin-top:4px">Heavier setup</div>
+>   </div>
+>   <div style="flex:1;padding:8px 10px;border-radius:8px;background:rgba(255,255,255,0.05)">
+>     <div style="font-size:10px;opacity:0.5;text-transform:uppercase;letter-spacing:.5px">SQLite</div>
+>     <div style="font-size:13px;font-weight:700;margin-top:2px">Single-writer</div>
+>     <div style="font-size:10px;opacity:0.5;margin-top:4px">Zero setup</div>
+>   </div>
+> </div>
+> </notch_html>
+> ```
+
+### Example 4 — Pagination via voice (long list)
+
+> **Human:** `[Mac] read me my unread emails.`
+> **You:** *(reply 1)*
+> ```
+> Three of seven worth a glance, Bruno. First: Alex about the migration. Say "next" for the rest.
+> <notch_html>
+> <div style="padding:10px 14px;display:flex;flex-direction:column;gap:6px;height:100%;box-sizing:border-box">
+>   <div style="display:flex;justify-content:space-between;align-items:baseline">
+>     <div style="font-size:13px;font-weight:700">Unread mail</div>
+>     <div style="font-size:9px;opacity:0.45">1 / 3</div>
+>   </div>
+>   <div style="height:1px;background:rgba(255,255,255,0.08)"></div>
+>   <div style="font-size:11px"><b>Alex Chen</b> · Migration plan</div>
+>   <div style="font-size:10px;opacity:0.6">"…can we move the cutover to Tue?"</div>
+> </div>
+> </notch_html>
+> ```
+> *(human says "next" → reply 2 with `1 / 3` swapped for `2 / 3` and the next email's body)*
+
+---
+
+## What Not To Do
+
+- ❌ **No long monologues.** If you can't say it in two sentences, you're either over-explaining or you should make the card carry it.
+- ❌ **No reading the card aloud.** The card and the speech complement each other; don't make them redundant.
+- ❌ **No external assets.** `<img src="https://…">`, `<link href="…">`, Google Fonts, none of it loads.
+- ❌ **No interactive elements.** Buttons render but do nothing — they read as broken UI. Drop them.
+- ❌ **No light backgrounds.** The pill is black. White text on a white card looks like a missing texture.
+- ❌ **No emoji as primary content** unless it's the answer. They render small at 12px and lose meaning.
+- ❌ **Don't send a card "just because"** if the answer is a bare fact. The card should add something the voice can't carry — structure, list, comparison, status.
+
+---
+
+## Reply Checklist
+
+Before you send:
+
+1. **Did the tag `[Mac]` actually start the user message?** If not, don't use this skill.
+2. **Is the spoken text ≤ 2 sentences, no markdown, no enumerations?**
+3. **🚫 Does my spoken text recite items that are already in my card?** If yes, **rewrite the speech as a lead-in only** ("Here are the top five, Bruno."). Speaking the card aloud is the #1 failure mode of this skill. Re-read the spoken text and the card together — if you remove the card, would the voice still make sense as the standalone answer? If yes, you're double-answering. Trim the voice.
+4. **If I'm sending a card, does it add structure the voice can't carry?** If a sentence covers it, drop the card.
+5. **Does my voice acknowledge the card if I sent one?** ("Here it is.", "Pinned it up top.", etc.)
+6. **Did I check for a PRESET first** ([`presets/PRESETS.md`](presets/PRESETS.md))? Only hand-write `<notch_html>` if no preset fits. (For custom, did I check `frequentSnippets/` for one I already made?)
+7. **If it's a preset:** is the body **valid JSON**, and is `type` one of the real preset names (lowercase)?
+8. **If it's custom:** is the card ≤ 383×147pt, transparent-on-black, white text, no external assets?
+9. **Is the tag spelled exactly `<notch_card type="…">…</notch_card>` or `<notch_html>…</notch_html>` (lowercase, underscore)?**
+10. **If I'm offering to save a custom card for next time, did I say so plainly?**
+
+---
+
+## Quick Reference
+
+| Thing | Where / how |
+|---|---|
+| Tag that activates this skill | `[Mac]` at the start of the user message |
+| **Preset card tag (preferred)** | `<notch_card type="…">{ …json… }</notch_card>` |
+| Preset catalog + schemas | [`presets/PRESETS.md`](presets/PRESETS.md) — email, list, calendar, weather, ticker, stat, info, text, comparison |
+| Custom card tag (escape hatch) | `<notch_html>…</notch_html>` (singular, anywhere in your reply) |
+| Canvas size | **383 × 147 pt**, transparent over **black** |
+| Custom snippet library | `workspace/skills/mac/frequentSnippets/*.html` |
+| TTS engine | ElevenLabs (Morphy handles it; you just write the words) |
+| Stripped from speech | Anything inside `<notch_card …>…` or `<notch_html>…` (case-insensitive, multi-line) |
+| Long text | **Scrollable** — the user scrolls long cards (email/list/calendar/text) with the trackpad |
+| Auto-opens notch? | Yes — sending a card ⇒ notch slides down automatically as audio starts |
+| Auto-clears? | When the human triggers the next push-to-talk, or after the safety timer |

package/workspace/skills/mac/frequentSnippets/calendar-today.html

@@ -0,0 +1,22 @@
+<!--
+  calendar-today.html
+  Placeholders:
+    {{weekday_short}}   e.g. "Thu"
+    {{date_label}}      e.g. "May 28"
+    {{events_html}}     a sequence of <div>…</div> rows OR the empty-state div.
+  Empty-state row:
+    <div style="font-size:11px;opacity:0.45;text-align:center;margin-top:14px">No events today.</div>
+  Event row (repeat):
+    <div style="display:flex;justify-content:space-between;font-size:11px">
+      <span style="opacity:0.75">{{time}} · {{title}}</span>
+      <span style="opacity:0.4">{{duration}}</span>
+    </div>
+-->
+<div style="padding:12px 16px;display:flex;flex-direction:column;gap:8px;height:100%;box-sizing:border-box">
+  <div style="display:flex;align-items:baseline;gap:8px">
+    <div style="font-size:22px;font-weight:700">{{weekday_short}}</div>
+    <div style="font-size:13px;opacity:0.55">{{date_label}}</div>
+  </div>
+  <div style="height:1px;background:rgba(255,255,255,0.08)"></div>
+  {{events_html}}
+</div>

package/workspace/skills/mac/frequentSnippets/info-card.html

@@ -0,0 +1,27 @@
+<!--
+  info-card.html  —  generic two-column key/value glance card.
+  Placeholders:
+    {{title}}        bold header, e.g. "Connection"
+    {{subtitle}}     small muted line under header, OPTIONAL ("" if none)
+    {{left_label}}   e.g. "Latency"
+    {{left_value}}   e.g. "42 ms"
+    {{right_label}}  e.g. "Loss"
+    {{right_value}}  e.g. "0%"
+-->
+<div style="padding:12px 16px;display:flex;flex-direction:column;gap:8px;height:100%;box-sizing:border-box">
+  <div>
+    <div style="font-size:13px;font-weight:700">{{title}}</div>
+    <div style="font-size:10px;opacity:0.5;margin-top:1px">{{subtitle}}</div>
+  </div>
+  <div style="height:1px;background:rgba(255,255,255,0.08)"></div>
+  <div style="display:flex;gap:10px">
+    <div style="flex:1;padding:8px 10px;border-radius:8px;background:rgba(255,255,255,0.05)">
+      <div style="font-size:9px;opacity:0.5;text-transform:uppercase;letter-spacing:.5px">{{left_label}}</div>
+      <div style="font-size:14px;font-weight:700;margin-top:2px">{{left_value}}</div>
+    </div>
+    <div style="flex:1;padding:8px 10px;border-radius:8px;background:rgba(255,255,255,0.05)">
+      <div style="font-size:9px;opacity:0.5;text-transform:uppercase;letter-spacing:.5px">{{right_label}}</div>
+      <div style="font-size:14px;font-weight:700;margin-top:2px">{{right_value}}</div>
+    </div>
+  </div>
+</div>

package/workspace/skills/mac/frequentSnippets/single-stat.html

@@ -0,0 +1,13 @@
+<!--
+  single-stat.html  —  one big number, one supporting line. Use for time,
+  countdown, temperature, percent, exchange rate, etc.
+  Placeholders:
+    {{label}}        small uppercase tag at top, e.g. "TOKYO"
+    {{value}}        the hero number/string, e.g. "20:14"
+    {{caption}}      muted line under value, e.g. "Thu, May 28"
+-->
+<div style="padding:14px 18px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px;height:100%;box-sizing:border-box">
+  <div style="font-size:9px;opacity:0.5;text-transform:uppercase;letter-spacing:1px">{{label}}</div>
+  <div style="font-size:38px;font-weight:200;line-height:1;font-feature-settings:'tnum' on">{{value}}</div>
+  <div style="font-size:11px;opacity:0.55">{{caption}}</div>
+</div>

package/workspace/skills/mac/presets/PRESETS.md

@@ -0,0 +1,226 @@
+# Notch card presets — data schemas
+
+Morphy ships a set of **beautiful, pre-built card renderers**. You send only the
+**data**; Morphy owns the layout, the typography, the colors, the scrolling. This
+is the fast, pretty path — use it whenever a preset fits. You never write CSS for
+these, and the card always looks on-brand.
+
+## How to send a preset
+
+Put one block anywhere in your `[Mac]` reply (it's stripped from TTS, never
+spoken):
+
+```
+<notch_card type="PRESET_NAME">
+{ ...JSON data for that preset... }
+</notch_card>
+```
+
+- `type` is the preset name (lowercase) from the table below.
+- The body is a **single JSON object**. Use valid JSON — double-quote keys and
+  strings, escape newlines inside strings as `\n` (multi-line text is fine and
+  encouraged for `email`/`text` bodies; it renders with real line breaks).
+- Unknown fields are ignored. Missing optional fields just don't render.
+- If the `type` is unknown or the JSON is malformed, Morphy shows **no card** (and
+  nothing leaks into your spoken reply) — so a typo fails safe, not loud.
+
+The same voice rules apply as always: **don't read the card's contents aloud** —
+the voice is a short lead-in, the card carries the detail. See `SKILL.md`.
+
+---
+
+## Presets
+
+### `stat` — one big number
+A single hero value with a label and caption. Time, countdown, %, rate, score.
+
+| Field | Req | Notes |
+|---|---|---|
+| `label` | ✓ | small uppercase tag, e.g. `"TOKYO"` |
+| `value` | ✓ | the hero string, e.g. `"8:14 PM"` |
+| `caption` | – | muted line under it |
+
+```
+<notch_card type="stat">
+{ "label": "TOKYO", "value": "8:14 PM", "caption": "Thursday, May 28" }
+</notch_card>
+```
+
+### `info` — header + two key/value tiles
+Two metrics side by side under a title.
+
+| Field | Req | Notes |
+|---|---|---|
+| `title` | ✓ | bold header |
+| `subtitle` | – | muted line under the title |
+| `left_label`, `left_value` | ✓ | first tile |
+| `right_label`, `right_value` | ✓ | second tile |
+
+```
+<notch_card type="info">
+{ "title": "Connection", "subtitle": "VPN · Frankfurt",
+  "left_label": "Latency", "left_value": "42 ms",
+  "right_label": "Loss", "right_value": "0%" }
+</notch_card>
+```
+
+### `email` — a single email
+Sender with an auto-generated initial avatar, subject, time, and a body the user
+can **scroll** if it's long. Perfect for "read me that email."
+
+| Field | Req | Notes |
+|---|---|---|
+| `from` | ✓ | sender name |
+| `body` | ✓ | full text; use `\n` for paragraphs |
+| `subject` | – | shown under the sender, truncated |
+| `time` | – | top-right, e.g. `"2:14 PM"` |
+| `initial` | – | avatar letter; **auto-derived from `from`** if omitted |
+
+```
+<notch_card type="email">
+{ "from": "Alex Chen", "time": "2:14 PM", "subject": "Migration plan",
+  "body": "Can we move the cutover to Tuesday?\n\nStaging looked clean last night." }
+</notch_card>
+```
+
+### `list` — ranked / labelled rows
+A scrolling list. Use for unread mail, todos, news, search results, top-N.
+
+| Field | Req | Notes |
+|---|---|---|
+| `title` | ✓ | header |
+| `items` | ✓ | array of objects (see below) |
+| `page`, `pages` | – | if both set and `pages > 1`, draws page dots; say "next" in voice and resend with the next `page` |
+
+Each item: `{ "title": ✓, "meta"?: "secondary line", "value"?: "right-aligned tag", "index"?: "1" }`
+
+```
+<notch_card type="list">
+{ "title": "Unread mail", "page": 1, "pages": 3,
+  "items": [
+    { "index": "1", "title": "Alex Chen", "meta": "Migration plan", "value": "2m" },
+    { "index": "2", "title": "Figma", "meta": "3 new comments", "value": "1h" },
+    { "index": "3", "title": "GitHub", "meta": "CI passed on main", "value": "3h" }
+  ] }
+</notch_card>
+```
+
+### `calendar` — day + events
+Day hero with a scrolling event list and a built-in empty state.
+
+| Field | Req | Notes |
+|---|---|---|
+| `weekday` | ✓ | e.g. `"Thu"` |
+| `date` | ✓ | e.g. `"May 28"` |
+| `count` | – | top-right, e.g. `"4 events"` |
+| `events` | ✓ | array; if empty, renders "Nothing scheduled." |
+
+Each event: `{ "time": "10:00", "title": "Stand-up", "duration"?: "30m" }`
+
+```
+<notch_card type="calendar">
+{ "weekday": "Thu", "date": "May 28", "count": "3 events",
+  "events": [
+    { "time": "10:00", "title": "Stand-up", "duration": "30m" },
+    { "time": "14:00", "title": "Design review", "duration": "1h" },
+    { "time": "16:30", "title": "1:1 with Sam", "duration": "30m" }
+  ] }
+</notch_card>
+```
+
+### `weather` — current conditions
+Big temp, an **auto-selected line-art glyph** (from `condition`), high/low, and an
+optional third tile.
+
+| Field | Req | Notes |
+|---|---|---|
+| `location` | ✓ | uppercase label |
+| `temp` | ✓ | number/string; a `°` is appended by the template |
+| `condition` | ✓ | text; also picks the glyph (keywords: clear/sun, partly, cloud, rain, snow, storm/thunder, fog/mist) |
+| `high`, `low` | ✓ | `°` appended |
+| `extra_label`, `extra_value` | – | optional third tile (e.g. Wind) |
+
+```
+<notch_card type="weather">
+{ "location": "San Francisco", "temp": "17", "condition": "Partly cloudy",
+  "high": "19", "low": "12", "extra_label": "Wind", "extra_value": "12mph" }
+</notch_card>
+```
+
+### `ticker` — finance quote
+Symbol, name, price, a **color-coded change** (green ↑ / red ↓, inferred from a
+leading `-`), and an **auto-generated sparkline** from a number array.
+
+| Field | Req | Notes |
+|---|---|---|
+| `symbol` | ✓ | e.g. `"TSLA"` |
+| `price` | ✓ | e.g. `"$248.50"` |
+| `change` | ✓ | e.g. `"+2.4%"` or `"-1.1%"` (sign drives the color) |
+| `name` | – | company name, truncated |
+| `points` | – | array of numbers → the sparkline chart (needs ≥ 2 values) |
+
+> **To get the little chart, you MUST include `points`.** Without it the card
+> renders price + change but **no chart**. Fetch ~8–30 recent values (intraday
+> prices, or the last N daily closes) and pass them as a plain number array —
+> exact scale doesn't matter, the sparkline auto-normalizes. If you genuinely
+> can't get a series, omit `points` and the card still looks fine without it.
+
+```
+<notch_card type="ticker">
+{ "symbol": "TSLA", "name": "Tesla Inc", "price": "$248.50", "change": "+2.4%",
+  "points": [241, 239, 244, 242, 247, 245, 250, 248.5] }
+</notch_card>
+```
+
+### `text` — title + long body
+A title (optional) and a body the user can **scroll** when it overflows. Use for
+summaries, explanations, "read me this", a quote, a paragraph answer.
+
+| Field | Req | Notes |
+|---|---|---|
+| `body` | ✓ | the text; `\n` for paragraphs |
+| `title` | – | header (with a divider) if present |
+| `tag` | – | small label top-right (e.g. `"#482"`) |
+
+```
+<notch_card type="text">
+{ "title": "PR summary", "tag": "#482",
+  "body": "Refactors the notch pipeline into a preset renderer.\n\nAdds nine presets the user can scroll." }
+</notch_card>
+```
+
+### `comparison` — two columns
+Side-by-side options, each with a value and a note.
+
+| Field | Req | Notes |
+|---|---|---|
+| `title` | ✓ | header |
+| `left_title`, `left_value` | ✓ | first column |
+| `right_title`, `right_value` | ✓ | second column |
+| `left_note`, `right_note` | – | muted line under each value |
+
+```
+<notch_card type="comparison">
+{ "title": "Postgres vs SQLite",
+  "left_title": "Postgres", "left_value": "Concurrent ✓", "left_note": "Heavier setup",
+  "right_title": "SQLite", "right_value": "Single-writer", "right_note": "Zero setup" }
+</notch_card>
+```
+
+---
+
+## When no preset fits → go custom
+
+If the answer needs a shape these don't cover, hand-write the whole card with
+`<notch_html>…</notch_html>` instead (see `SKILL.md` → custom snippets). And if you
+build a custom card you'll reuse, save it to `frequentSnippets/` so next time is a
+copy-fill-send. When a custom card you've made gets requested a lot, tell Bruno —
+it's a candidate for a real shipped preset.
+
+## Notes
+
+- **Scrollable.** Long `email` / `list` / `calendar` / `text` content is scrollable —
+  the user scrolls it with the trackpad (a thin scrollbar appears). For very long
+  lists you can still paginate via voice ("say next").
+- **Keep it to one idea.** The canvas is tiny (383 × 147 pt). A `list` realistically
+  shows ~4 rows before it has to scroll — lead with the most important ones.

package/workspace/skills/mac/skill.json

@@ -0,0 +1,15 @@
+{
+  "name": "mac",
+  "version": "1.0.0",
+  "type": "skill",
+  "bloby_human": "Bruno Bertapeli",
+  "bloby": "bloby-bruno",
+  "author": "newbot-official",
+  "description": "Morphy native macOS companion. Activates on the [Mac] tag. Output is a concise spoken reply (TTS); optionally accompany it with a <notch_html>…</notch_html> visual card rendered inside the MacBook notch (383×147pt, transparent over black). Frequent snippets are cached in workspace/skills/mac/frequentSnippets/ for instant re-use.",
+  "depends": [],
+  "env_keys": [],
+  "has_telemetry": false,
+  "size": "8KB",
+  "contains_binaries": false,
+  "tags": ["mac", "morphy", "notch", "macos", "voice", "tts", "visual", "html"]
+}