From 849aec84d490acc3ee3560c725e9c69bc17a7c65 Mon Sep 17 00:00:00 2001
From: th <th@skilleven.de>
Date: Wed, 8 Apr 2026 14:35:25 +0200
Subject: [PATCH] dist und hilfe

---
 config.php       |   2 +-
 dist.sh          |  20 +++++-
 public/index.php | 164 +++++++++++++++++++++++++++++------------------
 3 files changed, 119 insertions(+), 67 deletions(-)

diff --git a/config.php b/config.php
index 970f34b..2581132 100644
--- a/config.php
+++ b/config.php
@@ -1,7 +1,7 @@
 <?php
 
 define('APP_NAME', 'hyprcrd');
-define('APP_VERSION', '0.1.0');
+define('APP_VERSION', '0.1.1');
 
 // Database path — writable directory, outside webroot
 define('DB_PATH', __DIR__ . '/data/hyprcrd.db');
diff --git a/dist.sh b/dist.sh
index 9208be9..9c48b2c 100755
--- a/dist.sh
+++ b/dist.sh
@@ -1,10 +1,24 @@
 #!/bin/bash
-# Build hyprcrd distribution ZIP
+# Build hyprcrd distribution ZIP with version bump
 set -e
 
 cd "$(dirname "$0")"
 
-VERSION=$(grep "APP_VERSION" config.php | grep -oP "'[^']+'" | tail -1 | tr -d "'" || echo "dev")
+# Read current version
+CURRENT=$(grep "APP_VERSION" config.php | grep -oP "'[^']+'" | tail -1 | tr -d "'")
+IFS='.' read -r MAJOR MINOR PATCH <<< "$CURRENT"
+
+# Bump: --major, --minor, or patch (default)
+case "${1:-patch}" in
+    --major) MAJOR=$((MAJOR + 1)); MINOR=0; PATCH=0 ;;
+    --minor) MINOR=$((MINOR + 1)); PATCH=0 ;;
+    *) PATCH=$((PATCH + 1)) ;;
+esac
+
+VERSION="${MAJOR}.${MINOR}.${PATCH}"
+sed -i "s/APP_VERSION', '${CURRENT}'/APP_VERSION', '${VERSION}'/" config.php
+echo "Version: ${CURRENT} → ${VERSION}"
+
 DIST="hyprcrd-${VERSION}.zip"
 
 # Rebuild Tailwind if CLI exists
@@ -20,7 +34,7 @@ zip -r "$DIST" \
     Dockerfile \
     docker-entrypoint.sh \
     README.md \
-    .htaccess \
+    dist.sh \
     .gitignore \
     src/ \
     public/ \
diff --git a/public/index.php b/public/index.php
index 621586e..49b5ff1 100644
--- a/public/index.php
+++ b/public/index.php
@@ -691,59 +691,61 @@ if (str_starts_with($route, '/api/')) {
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-info text-sm"></i>concepts</h3>
                     <div class="text-xs leading-relaxed space-y-3 text-t-muted">
-                        <p><span class="text-t-bright font-pixel">cards</span> are the basic unit — each card has a title, a markdown body, a color, and optional tags. Cards appear as tiles on the board. Click to preview, double-click to edit, right-click for actions. Cards can contain images, checklists, links to other cards, and any markdown content.</p>
-                        <p><span class="text-t-bright font-pixel">buckets</span> organize cards into categories (like folders or columns). Each bucket has a name and color. The bucket bar at the top lets you filter the board. Special built-in views: <span class="text-t-dim font-pixel">all</span> (everything), <span class="text-t-dim font-pixel">current</span> (recently touched), <span class="text-t-dim font-pixel">favorites</span> (starred), <span class="text-t-dim font-pixel">journal</span> (date-titled cards), <span class="text-t-dim font-pixel">unsorted</span> (no bucket). Drag a card onto a bucket tab to move it. Drag to the + button to create a new bucket from a card.</p>
-                        <p><span class="text-t-bright font-pixel">groups</span> let you nest cards. Drag a card to the center of another card to group them. The parent card shows a badge with the member count. Click the badge or use "open group" in the context menu to see all members. Inside a group you can reorder, drag cards out to ungroup, or drag the first card to promote a new parent. Use "dissolve group" to ungroup all at once.</p>
-                        <p><span class="text-t-bright font-pixel">tags</span> are written as <span class="text-t-dim font-pixel">#tagname</span> in the card body and extracted automatically. They support hierarchy: <span class="text-t-dim font-pixel">#project/frontend</span>. Click a tag on any card to filter the board — Ctrl+click to combine multiple tags (AND). Tags can also be assigned via right-click > tags without editing the card body. Each segment of a hierarchical tag is independently clickable.</p>
-                        <p><span class="text-t-bright font-pixel">links</span> connect cards. Write <span class="text-t-dim font-pixel">[[Card Title]]</span> in the body to create a link. Linked cards are clickable in preview and show up as backlinks on the target card. The split view shows related cards based on shared tags, links, and content overlap.</p>
+                        <p><i class="ph ph-cards text-t-accent text-sm"></i> <span class="text-t-bright font-pixel">cards</span> are the basic unit — each card has a title, a markdown body, a color, and optional tags. Cards appear as tiles on the board. Click to preview, double-click to edit, right-click for actions. Cards can contain images, checklists, links to other cards, and any markdown content.</p>
+                        <p><i class="ph ph-folder text-t-accent text-sm"></i> <span class="text-t-bright font-pixel">buckets</span> organize cards into categories (like folders or columns). Each bucket has a name and color. The bucket bar at the top lets you filter the board. Special built-in views: <i class="ph ph-squares-four text-xs"></i> <span class="text-t-dim font-pixel">all</span>, <i class="ph ph-lightning text-xs"></i> <span class="text-t-dim font-pixel">current</span>, <i class="ph ph-star text-xs"></i> <span class="text-t-dim font-pixel">favorites</span>, <i class="ph ph-notebook text-xs"></i> <span class="text-t-dim font-pixel">journal</span>, <i class="ph ph-tray text-xs"></i> <span class="text-t-dim font-pixel">unsorted</span>. Drag a card onto a bucket tab to move it. Drag to <i class="ph ph-plus text-xs"></i> to create a new bucket.</p>
+                        <p><i class="ph ph-stack text-t-accent text-sm"></i> <span class="text-t-bright font-pixel">groups</span> let you nest cards. Drag a card to the center of another card to group them. The parent card shows a badge with the member count. Click the badge or use <i class="ph ph-stack text-xs"></i> "open group" in the context menu to see all members. Inside a group you can reorder, drag cards out to ungroup, or drag the first card to promote a new parent. Use <i class="ph ph-arrow-line-up text-xs"></i> "dissolve group" to ungroup all at once.</p>
+                        <p><i class="ph ph-hash text-t-accent text-sm"></i> <span class="text-t-bright font-pixel">tags</span> are written as <span class="text-t-accent font-pixel">#tagname</span> in the card body and extracted automatically. They support hierarchy: <span class="text-t-accent font-pixel">#project/frontend</span>. Click a tag to filter — Ctrl+click to combine multiple tags (AND). Assign via right-click > <i class="ph ph-hash text-xs"></i> tags. Each segment of a hierarchical tag is independently clickable.</p>
+                        <p><i class="ph ph-link text-t-accent text-sm"></i> <span class="text-t-bright font-pixel">links</span> connect cards. Write <span class="text-t-accent font-pixel">[[Card Title]]</span> in the body to create a link. Linked cards are clickable in preview and show up as <i class="ph ph-arrow-bend-left-up text-xs"></i> backlinks on the target card. The <i class="ph ph-split-horizontal text-xs"></i> split view shows related cards based on shared tags, links, and content overlap.</p>
+                        <p><i class="ph ph-calendar-dots text-t-accent text-sm"></i> <span class="text-t-bright font-pixel">calendar</span> shows cards on their dates. Journal cards (<span class="text-t-dim font-pixel">YYYY-MM-DD</span>) and appointments (<span class="text-t-dim font-pixel">YYYY-MM-DD — Subject</span>) appear on their date. <i class="ph ph-cake text-xs" style="color:#fb7185"></i> Birthdays (<span class="text-t-accent font-pixel">#geburtstag</span>) repeat yearly. Sync with ownCloud/Nextcloud via <i class="ph ph-cloud-arrow-up text-xs"></i> CalDAV.</p>
                     </div>
                 </section>
 
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-keyboard text-sm"></i>shortcuts</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">Ctrl+K</td><td>open / close search</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Ctrl+Z</td><td>undo last action</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">F1</td><td>open / close help</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Escape</td><td>close any overlay</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel">Ctrl+K</td><td><i class="ph ph-magnifying-glass text-xs"></i> open / close search</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">Ctrl+Z</td><td><i class="ph ph-arrow-counter-clockwise text-xs"></i> undo last action</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">F1</td><td><i class="ph ph-question text-xs"></i> open / close help</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">Escape</td><td><i class="ph ph-x text-xs"></i> close any overlay</td></tr>
                     </table>
                 </section>
 
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-squares-four text-sm"></i>board</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">click card</td><td>open preview</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">double-click</td><td>open editor</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">right-click</td><td>context menu (color, bucket, tags, ...)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Ctrl+click</td><td>multi-select cards</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">drag card</td><td>reorder, move to bucket, or group</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">click tag</td><td>filter by tag</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Ctrl+click tag</td><td>add/remove tag filter (AND)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">group badge</td><td>expand group</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel">click card</td><td><i class="ph ph-eye text-xs"></i> open preview (or side panel in split mode)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">double-click</td><td><i class="ph ph-pencil-simple text-xs"></i> open editor</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">right-click</td><td><i class="ph ph-list text-xs"></i> context menu (color, bucket, tags, ...)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">Ctrl+click</td><td><i class="ph ph-check-square text-xs"></i> multi-select cards</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">drag card</td><td><i class="ph ph-arrows-out-cardinal text-xs"></i> reorder, move to bucket, or group</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">click tag</td><td><i class="ph ph-funnel text-xs"></i> filter by tag</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">Ctrl+click tag</td><td><i class="ph ph-plus-circle text-xs"></i> add/remove tag filter (AND)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">group badge</td><td><i class="ph ph-stack text-xs"></i> expand group</td></tr>
                     </table>
                 </section>
 
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-eye text-sm"></i>preview</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">double-click image</td><td>fullscreen (scroll to zoom, drag to pan)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Arrow Left/Right</td><td>prev/next image in gallery</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">click [[link]]</td><td>open linked card</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">click checkbox</td><td>toggle task completion</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">zen mode</td><td>full-screen reading (drag edges to resize)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">split view</td><td>show related / tagged cards side-by-side</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel">double-click image</td><td><i class="ph ph-arrows-out text-xs"></i> fullscreen (scroll to zoom, drag to pan)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-caret-left text-xs"></i> <i class="ph ph-caret-right text-xs"></i></td><td>prev/next image in gallery</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">click <span class="text-t-accent">[[link]]</span></td><td><i class="ph ph-arrow-square-out text-xs"></i> open linked card</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">click checkbox</td><td><i class="ph ph-check-square text-xs"></i> toggle task completion</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-corners-out text-xs"></i> zen mode</td><td>full-screen reading (drag edges to resize)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-split-horizontal text-xs"></i> split view</td><td>show related / tagged cards side-by-side</td></tr>
                     </table>
                 </section>
 
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-pencil-simple text-sm"></i>editor</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">Ctrl+S</td><td>save</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Ctrl+Shift+S</td><td>save and close</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Alt+Arrow Up/Down</td><td>move line</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Shift+Alt+Arrow</td><td>duplicate line</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel">Ctrl+S</td><td><i class="ph ph-floppy-disk text-xs"></i> save</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">Ctrl+Shift+S</td><td><i class="ph ph-floppy-disk text-xs"></i> save and close</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">Alt+<i class="ph ph-arrow-up text-xs"></i>/<i class="ph ph-arrow-down text-xs"></i></td><td>move line up/down</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">Shift+Alt+<i class="ph ph-arrow-up text-xs"></i>/<i class="ph ph-arrow-down text-xs"></i></td><td>duplicate line</td></tr>
                         <tr><td class="py-1 text-t-dim font-pixel">Tab</td><td>indent (4 spaces)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">paste/drag image</td><td>upload and insert</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">paste / drag</td><td><i class="ph ph-upload-simple text-xs"></i> upload and insert image</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-scissors text-xs"></i> extract</td><td>selection to new card</td></tr>
                         <tr><td class="py-1 text-t-dim font-pixel">drag divider</td><td>resize editor / preview split</td></tr>
                     </table>
                 </section>
@@ -751,34 +753,34 @@ if (str_starts_with($route, '/api/')) {
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-lightning text-sm"></i>autocomplete</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">[[</td><td>link to card (search by title)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">#</td><td>tag autocomplete (existing tags)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?</td><td>snippet menu (see below)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">Arrow Up/Down</td><td>navigate suggestions</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel"><span class="text-t-accent">[[</span></td><td><i class="ph ph-link text-xs"></i> link to card (search by title)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">#</span></td><td><i class="ph ph-hash text-xs"></i> tag autocomplete (existing tags)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">?</span></td><td><i class="ph ph-magic-wand text-xs"></i> snippet menu (see below)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-arrow-up text-xs"></i> <i class="ph ph-arrow-down text-xs"></i></td><td>navigate suggestions</td></tr>
                         <tr><td class="py-1 text-t-dim font-pixel">Enter / Tab</td><td>accept suggestion</td></tr>
                     </table>
                 </section>
 
                 <section>
-                    <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-magic-wand text-sm"></i>snippets (type ? + keyword + space)</h3>
+                    <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-magic-wand text-sm"></i>snippets <span class="text-t-dim font-pixel" style="font-weight:400">type ? + keyword + space</span></h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">?dat</td><td>current date (2026-04-07)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?time</td><td>current time (22:53)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?now</td><td>date + time</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?week</td><td>calendar week (KW15)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?todo</td><td>checkbox - [ ]</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?hr</td><td>horizontal rule ---</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?h1 ?h2 ?h3</td><td>headings</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?table</td><td>markdown table template</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">?code</td><td>fenced code block</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel">?dat</td><td><i class="ph ph-calendar text-xs"></i> current date</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">?time</td><td><i class="ph ph-clock text-xs"></i> current time</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">?now</td><td><i class="ph ph-clock-countdown text-xs"></i> date + time</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">?week</td><td><i class="ph ph-calendar-blank text-xs"></i> calendar week (KW15)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">?todo</td><td><i class="ph ph-check-square text-xs"></i> checkbox - [ ]</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">?hr</td><td><i class="ph ph-minus text-xs"></i> horizontal rule ---</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">?h1 ?h2 ?h3</td><td><i class="ph ph-text-h text-xs"></i> headings</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">?table</td><td><i class="ph ph-table text-xs"></i> markdown table template</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">?code</td><td><i class="ph ph-code text-xs"></i> fenced code block</td></tr>
                     </table>
                 </section>
 
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-calculator text-sm"></i>inline calculator</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">?3+5 Space</td><td>replaces with 8</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">34+56? Space</td><td>becomes 34+56=90</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel"><span class="text-t-accent">?</span>3+5 Space</td><td><i class="ph ph-equals text-xs"></i> replaces with 8</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">34+56<span class="text-t-accent">?</span> Space</td><td><i class="ph ph-equals text-xs"></i> becomes 34+56=90</td></tr>
                         <tr><td class="py-1 text-t-dim font-pixel">operators</td><td>+ - * / () % ^</td></tr>
                     </table>
                 </section>
@@ -786,43 +788,79 @@ if (str_starts_with($route, '/api/')) {
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-hash text-sm"></i>tags</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">#tagname</td><td>write tags in card body</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">#parent/child</td><td>hierarchical tags</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">right-click > tags</td><td>assign tags via context menu</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">click tag segment</td><td>each path level is clickable</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel"><span class="text-t-accent">#tagname</span></td><td>write tags in card body</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">#parent/child</span></td><td><i class="ph ph-tree-structure text-xs"></i> hierarchical tags</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">right-click > <i class="ph ph-hash text-xs"></i> tags</td><td>assign tags via context menu</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">click segment</td><td><i class="ph ph-funnel text-xs"></i> each path level is clickable</td></tr>
                     </table>
                 </section>
 
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-magnifying-glass text-sm"></i>search</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">text</td><td>search titles + body</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">#tag</td><td>filter by tag</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">#tag word</td><td>tag filter + text search</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">#tag1 #tag2</td><td>multiple tags (AND)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">bucket filter</td><td>dropdown to restrict scope</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel">text</td><td><i class="ph ph-magnifying-glass text-xs"></i> search titles + body</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">#tag</span></td><td><i class="ph ph-funnel text-xs"></i> filter by tag</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">#tag</span> word</td><td>tag filter + text search combined</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">#tag1 #tag2</span></td><td><i class="ph ph-intersect text-xs"></i> multiple tags (AND)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">bucket filter</td><td><i class="ph ph-folder text-xs"></i> dropdown to restrict scope</td></tr>
                     </table>
                 </section>
 
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-article text-sm"></i>markdown</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">[[title]]</td><td>card link</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">```gallery</td><td>image gallery grid (click to fullscreen)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">```tree</td><td>tree-style list</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">```bullets</td><td>bullet-style list</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">- [ ] / - [x]</td><td>interactive checkboxes</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">external links</td><td>open in new tab automatically</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel"><span class="text-t-accent">[[title]]</span></td><td><i class="ph ph-link text-xs"></i> card link</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">```gallery</span></td><td><i class="ph ph-images text-xs"></i> image gallery grid (click to fullscreen)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">```tree</span></td><td><i class="ph ph-tree-structure text-xs"></i> tree-style list</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">```bullets</span></td><td><i class="ph ph-list-bullets text-xs"></i> bullet-style list</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">- [ ] / - [x]</td><td><i class="ph ph-check-square text-xs"></i> interactive checkboxes</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">http://...</td><td><i class="ph ph-arrow-square-out text-xs"></i> external links open in new tab</td></tr>
+                    </table>
+                </section>
+
+                <section>
+                    <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-calendar-dots text-sm"></i>calendar</h3>
+                    <table class="w-full text-xs">
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel">click day</td><td><i class="ph ph-caret-down text-xs"></i> open day popup with all cards</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">click item</td><td><i class="ph ph-eye text-xs"></i> open card preview</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">double-click item</td><td><i class="ph ph-pencil-simple text-xs"></i> open card editor</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">right-click item</td><td><i class="ph ph-list text-xs"></i> context menu</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">+ termin</td><td><i class="ph ph-calendar-plus text-xs"></i> new appointment (choose calendar)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel">+ journal</td><td><i class="ph ph-notebook text-xs"></i> new/open journal for that day</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-cake text-xs" style="color:#fb7185;"></i> geb.</td><td>new birthday (repeats yearly)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-caret-left text-xs"></i> <i class="ph ph-caret-right text-xs"></i></td><td>navigate months</td></tr>
+                    </table>
+                </section>
+
+                <section>
+                    <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-cloud-arrow-up text-sm"></i>CalDAV sync</h3>
+                    <table class="w-full text-xs">
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel"><i class="ph ph-gear text-xs"></i> gear icon</td><td>CalDAV settings (URL, credentials, calendar colors)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-cloud-arrow-up text-xs"></i> sync</td><td>manual sync (also auto every 2 min)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">#termin</span></td><td><i class="ph ph-calendar-dots text-xs"></i> card syncs as calendar event</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">#geburtstag</span></td><td><i class="ph ph-cake text-xs"></i> card syncs as yearly birthday</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><span class="text-t-accent">#termin #privat</span></td><td><i class="ph ph-folder text-xs"></i> pushes to "Privat" calendar</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-arrows-clockwise text-xs"></i> recurring</td><td>birthdays + RRULE events repeat in view</td></tr>
+                    </table>
+                </section>
+
+                <section>
+                    <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-layout text-sm"></i>views</h3>
+                    <table class="w-full text-xs">
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel"><i class="ph ph-split-horizontal text-xs"></i> split</td><td>side-by-side board + preview panel</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-list text-xs"></i> superview</td><td>compact multi-column title list with hover cards</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-calendar-x text-xs"></i> hide termine</td><td>toggle appointment cards on/off</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-sort-ascending text-xs"></i> sort</td><td>manual / newest / oldest / alpha / tag</td></tr>
                     </table>
                 </section>
 
                 <section>
                     <h3 class="font-pixel text-xs text-t-accent mb-3 flex items-center gap-2"><i class="ph ph-download-simple text-sm"></i>import / export</h3>
                     <table class="w-full text-xs">
-                        <tr><td class="py-1 text-t-dim w-40 font-pixel">export</td><td>JSON + media ZIP (re-importable)</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">vault</td><td>Obsidian / Logseq markdown vault</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">right-click > save .md</td><td>single card as markdown + images</td></tr>
-                        <tr><td class="py-1 text-t-dim font-pixel">import</td><td>restore from exported ZIP</td></tr>
+                        <tr><td class="py-1 text-t-dim w-40 font-pixel"><i class="ph ph-download-simple text-xs"></i> export</td><td>JSON + media ZIP (re-importable)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-vault text-xs"></i> vault</td><td>Obsidian / Logseq markdown vault</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-file-md text-xs"></i> save .md</td><td>single card as markdown + images (right-click)</td></tr>
+                        <tr><td class="py-1 text-t-dim font-pixel"><i class="ph ph-upload-simple text-xs"></i> import</td><td>restore from exported ZIP</td></tr>
                     </table>
                 </section>