Merge pull request #318 from ausboss/release/2.22.1

Release 2.23.0

.github/workflows/publish_action.yml

@@ -11,6 +11,7 @@ on:
 # version in pyproject.toml, or on a manual run from main. Editing another
 # pyproject field (description, keywords) without a new version publishes
 # nothing, and the offline checks must pass before anything is uploaded.
+# A successful upload also creates the version's tag and GitHub Release.
 # Requires the repository secret REGISTRY_ACCESS_TOKEN, an API key created
 # for the "ausboss" publisher at registry.comfy.org.
 permissions:
@@ -28,6 +29,7 @@ jobs:
     if: ${{ github.repository == 'ausboss/ComfyUI-AusBoss' && github.ref == 'refs/heads/main' }}
     outputs:
       publish: ${{ steps.version.outputs.publish }}
+      version: ${{ steps.version.outputs.version }}
     steps:
       - uses: actions/checkout@v7
         with:
@@ -44,6 +46,7 @@ jobs:
         run: |
           read_version='import sys, tomllib; print(tomllib.loads(sys.stdin.read())["project"]["version"])'
           current=$(python -c "$read_version" < pyproject.toml)
+          echo "version=$current" >> "$GITHUB_OUTPUT"
           previous=""
           if [ -n "$BEFORE" ] && git cat-file -e "$BEFORE^{commit}" 2>/dev/null; then
             previous=$(git show "$BEFORE:pyproject.toml" | python -c "$read_version")
@@ -84,3 +87,33 @@ jobs:
         uses: Comfy-Org/publish-node-action@main
         with:
           personal_access_token: ${{ secrets.REGISTRY_ACCESS_TOKEN }}
+
+  github-release:
+    name: Create GitHub Release
+    needs: [check, publish-node]
+    if: ${{ needs.check.outputs.publish == 'true' }}
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    permissions:
+      contents: write
+    steps:
+      - uses: actions/checkout@v7
+        with:
+          persist-credentials: false
+      - uses: actions/setup-python@v7
+        with:
+          python-version: "3.12"
+      - name: Publish release notes and tag
+        env:
+          GH_TOKEN: ${{ github.token }}
+          GH_REPO: ${{ github.repository }}
+          VERSION: ${{ needs.check.outputs.version }}
+        run: |
+          tag="v$VERSION"
+          if gh release view "$tag" >/dev/null 2>&1; then
+            echo "Release $tag already exists; leaving it unchanged."
+            exit 0
+          fi
+          python scripts/changelog_notes.py --version "$VERSION" --full > "$RUNNER_TEMP/release-notes.md"
+          gh release create "$tag" --target "$GITHUB_SHA" --title "$VERSION" \
+            --notes-file "$RUNNER_TEMP/release-notes.md" --latest

.github/workflows/publish_model_downloader.yml

@@ -0,0 +1,74 @@
+name: Publish Model Downloader addon
+
+on:
+  workflow_dispatch:
+    inputs:
+      addon_commit:
+        description: Full commit SHA from ComfyUI-AusBoss-Model-Downloader main
+        required: true
+        type: string
+
+# The existing AusBoss publisher credential stays in this repository. This
+# manual job publishes only the separately maintained Model Downloader addon.
+# It does not release or change the main AusBoss node pack.
+permissions:
+  contents: read
+
+concurrency:
+  group: registry-publish-model-downloader
+  cancel-in-progress: false
+
+jobs:
+  publish:
+    if: github.repository == 'ausboss/ComfyUI-AusBoss' && github.ref == 'refs/heads/main'
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+    steps:
+      - name: Require an exact addon commit
+        env:
+          ADDON_COMMIT: ${{ inputs.addon_commit }}
+        run: '[[ "$ADDON_COMMIT" =~ ^[0-9a-f]{40}$ ]]'
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7
+        with:
+          repository: ausboss/ComfyUI-AusBoss-Model-Downloader
+          ref: ${{ inputs.addon_commit }}
+          fetch-depth: 0
+          persist-credentials: false
+      - name: Require a commit merged into addon main
+        run: git merge-base --is-ancestor HEAD origin/main
+      - uses: actions/setup-python@6d4fd22b20465ccc0f7354476588e8df7c9ca0e0 # v7
+        with:
+          python-version: '3.12'
+      - uses: actions/setup-node@949feb2413d6458794dcd2491c4babbbce0c15c1 # v7
+        with:
+          node-version: '24'
+          package-manager-cache: false
+      - name: Install validation and publishing tools
+        run: python -m pip install -r requirements-dev.txt comfy-cli==1.25.0
+      - name: Offline checks
+        run: |
+          python -m unittest discover -s tests -v
+          ruff check --select F,E9 __init__.py downloader tests scripts
+          node --test tests/*.test.mjs
+          node --check js/model_downloader/index.js
+          node --check js/shared/download_controls.mjs
+      - name: Build and inspect Registry package
+        run: |
+          comfy --skip-prompt --no-enable-telemetry node pack
+          python scripts/check_registry_package.py
+      - name: Refuse an existing immutable version
+        run: python scripts/registry_status.py --require-unpublished
+      - name: Publish addon
+        id: publish
+        env:
+          REGISTRY_ACCESS_TOKEN: ${{ secrets.REGISTRY_ACCESS_TOKEN }}
+          COMFY_NODE_CHANGELOG: 'Initial release: model downloads from Civitai and Hugging Face, installed-file checks, saved model lists, and AusBoss Workflow Note integration.'
+        run: |
+          if [ -z "$REGISTRY_ACCESS_TOKEN" ]; then
+            echo '::error::REGISTRY_ACCESS_TOKEN is not configured.'
+            exit 1
+          fi
+          comfy --skip-prompt --no-enable-telemetry node publish --token "$REGISTRY_ACCESS_TOKEN"
+      - name: Report Registry review status
+        if: always() && steps.publish.outcome != 'skipped'
+        run: python scripts/registry_status.py --report

CHANGELOG.md

@@ -2,8 +2,162 @@
 
 All notable changes to ComfyUI-AusBoss are documented here.
 
-## Unreleased
+## 2.23.0 - 2026-11-09
 
+- **Mask by Touch keeps your picks when the picture changes.** Your clicks
+  and paint move onto the new picture, in the same places, so an edit before
+  the node no longer means picking everything again. On a picture of another
+  size they are scaled to fit. A click finds whatever is at that spot now;
+  paint stays exactly as painted. For the old way, set **New picture**, under
+  More, to **start over**.
+
+- **Workflow Switches: a switch that changes a setting no longer turns its
+  node off.** The node it sets keeps running. LoRA choices keep every field
+  that differs between them, and the add-choice button shows as soon as a
+  node is selected.
+
+- **Mask by Touch clears a stopped run's message once a run works.** When
+  a run stopped at the node, its message stayed on the picture after the
+  next run from the Run button had worked. It now goes as soon as the new
+  result comes in.
+
+- **Video Crop + Rotate + Pad → Clip: the fixed_frames input sits on its own
+  row again.** In workflows saved by an earlier release, newer ComfyUI drew
+  fixed_frames on top of force_rate, so a link could not be dropped on it.
+  Every input the pack moves into the input column now gets its own row.
+
+- **Node colours stay after a save and reload.** A colour picked from the
+  right-click menu now survives saving, reloading and pasting. In Nodes 2.0,
+  About this node is in the right-click menu, and dragging a node's corner
+  snaps to nearby lines (hold Shift to skip the snap).
+
+- **Image Folder shows the right pictures when you change folders.**
+  Switching folders or reloading a workflow no longer shows old or mixed-up
+  results, a very large folder keeps its newest files, and thumbnails refresh
+  when a picture is saved over.
+
+- **Crop for Inpaint keeps the whole soft edge inside the crop.** The blend
+  at the seam is now complete. Crops and blend masks can come out slightly
+  different from earlier releases for the same inputs.
+
+- **Compare, the preview bar and Save Image no longer show a stale picture.**
+  A late reply is ignored once the picture has changed, and Save Image
+  forgets its old saved file when the folder changes. Save Image also takes
+  bfloat16 and one-channel images, and a blank linked caption writes no
+  caption file.
+
+- **Color Match leaves a picture alone when matched to itself.** When the
+  reference is the same picture, or the same colours at another size, the
+  picture now comes back unchanged instead of shifting colour. Other matches
+  can differ from earlier releases by less than one shade step.
+
+- **Krea 2 Outpaint Model Patch no longer reuses an old reference.** On a
+  fresh server's first run, its reference cache could hand back a stale
+  reference, so the new area came out different from a run without the
+  cache. Now both match exactly. Other model patches on the same model also
+  apply alongside it.
+
+- **Three example workflow notes now match their graphs.** Krea 2 Rotate +
+  Outpaint says its tone match is on, Qwen Image 2.1 Inpaint says its seed is
+  fixed, and Qwen Image 2.1 Upscale + Restore says the redraw is at least
+  about 2 MP.
+
+- **The pack's own checks are stricter.** They read pyproject.toml properly
+  and catch more ways a node could be hidden from the Registry's scanners.
+  Nothing changes in your workflows.
+
+## 2.22.0 - 2026-11-07
+
+- **Node cards have a calmer, easier-to-read look.** Number boxes, choices,
+  switches, fields and buttons are now one solid gray with no outlines, on a
+  dark card. Labels, units and section names are lighter and easier to read,
+  and every control in a card row is the same height. The bar above a result
+  picture (the picture arrows, the Preview steps and Preview switches, and
+  buttons such as AUTO) and the picture's frame match the cards. The colors
+  live in one shared file, so the rest of the pack can follow.
+
+- **Mask by Touch 🆎 no longer fills holes unless you ask.** Fill small
+  holes, under More, now starts off, so a hole you pick stays a hole. Saved
+  workflows keep their setting.
+
+- **H3 Prompt Writer: a swap no longer makes the new person talk to noise.** With
+  **Keep the clip's sound** on and no words typed, the writer told H3 the new
+  person speaks as in the video whenever the clip's sound was loud, so a train
+  or a beat made their mouth move. It now does that only when it hears a real
+  voice: half a second or more of clear speech.
+
+- **Mask by Touch shows a changed picture without unplugging it.** When the
+  picture coming in changes and the run stops because the picks were made on
+  the old one, the new picture now shows on the node, ready to pick from. A
+  new reload button beside Undo shows it any time, without running the
+  workflow.
+- **Save Image and Save Video: the Steps switch is now called Preview steps.** It
+  shows the picture or the clip's first frame while it is being made, and "Steps"
+  read like a sampler's step count. It works the same, and saved workflows keep
+  their setting.
+
+## 2.21.2 - 2026-11-07
+
+- **H3 Prompt Writer reads a plain swap sentence.** "Replace the man in the red
+  shirt with @1", "Swap the woman for @1" and similar phrasings now name only the
+  person who goes, instead of putting the whole sentence into the prompt.
+- **A swapped-in person is there from the first frame.** Swaps with a picture
+  always ask for the replacement throughout, with no transition or morph.
+- **A text model on H3 Prompt Writer's `clip` input writes the `@1 looks like`
+  line in a swap.** It describes the person's hair and face from the picture
+  when no line is typed. Without a model on `clip`, nothing changes.
+- **Workflow Note tiles start compact in the classic canvas again.** A leftover
+  image preview filed under the node's id made the classic canvas grow a new
+  tile to hold the picture; notes now stand that preview down.
+- **Colored link buttons and pop-out notes keep their tile layout when shared.**
+  Callout Tile and Workflow Note Tile save as distinct node types, so an older
+  install can report what is missing. Tiles have larger editors and visible
+  resize grips, start compact when added, and pop-out notes wrap long code lines.
+- **H3 Prompt Writer can change something in a video while keeping its person and sound.**
+  The new `keeps_clip_sound` output helps route the source audio. Video edits
+  show **From the clip** for their length, and swaps accept an optional
+  `@1 looks like ...` line describing the connected replacement.
+- **Workflow Switches' Off and On buttons now select the state they name.**
+  Pressing the already selected state leaves it unchanged.
+
+
+## 2.21.1 - 2026-11-06
+
+- **The README release badge stays available when the badge service is down.**
+  The badge is served from the repository, shows the current version, and opens
+  the latest GitHub Release.
+
+## 2.21.0 - 2026-11-05
+
+- **Crop + Rotate + Pad has clearer controls and steadier previews.** Image
+  and video pickers share Inputs and Outputs tabs and a Load button. Video
+  previews have a play/pause button, and dragging a locked-length clip stops
+  where the full selection still fits. Crop, pad and resize controls share
+  the same compact buttons, and warnings no longer move the controls below.
+- **Latent Size can show just the sizes recommended for your workflow.**
+  Pick the allowed presets in its settings and save them with the workflow.
+  Workflows without a custom list keep all their choices.
+- **Workflow Notes and Callouts can be compact titles, links and guide tiles.**
+  Guides support formatted text, tables, accent colors and model download
+  links. YouTube and Discord tiles keep their red and purple choices.
+- **Media lists open faster on network shares, and controls load behind
+  a web address prefix.** File scans reuse directory information. Frontend
+  imports also work when ComfyUI is served under a path such as `/comfy/`.
+- **GitHub Releases now follow version updates automatically.** After the
+  Registry upload, the publish workflow creates the release with its notes.
+  The README release badge uses that release and opens its download page.
+
+- **LoRA Loader supports stacks larger than 64 rows.** Folder adds, templates, and absorbed loaders keep the full stack when you save and reopen a workflow.
+- **Workflow Note info tiles show a book for guides and a download arrow for models.** Click the dark tile to open the note. Its icon and left edge use the accent you picked.
+- **H3 Prompt Writer swaps two people.** With Swap the person and two person
+  pictures, Picture 1 takes the place of the person on the left and Picture 2
+  the person on the right. Type who goes to change that, one line each, such
+  as `@1 the man in the hat` and `@2 the woman in red`.
+- **New node: Load Audio.** Load a sound file and keep only the part you
+  want. The node shows the sound as a wave: drag the IN and OUT handles to
+  trim it, and press play to hear just that part. Set Max length to the
+  longest sound the next step takes, and anything longer shows in red as
+  cut off, so you see exactly what comes out before you run.
 - **Resizing one node of a selection now resizes them all.** With two or more
   nodes selected, pull the edge or corner of one: nodes stacked in a column
   get its width, nodes side by side in a row get its height, and a grid gets
@@ -40,8 +194,8 @@ All notable changes to ComfyUI-AusBoss are documented here.
   by a corner lines that edge up the same way. Hold Shift while you drag to
   place it without lining up; ComfyUI then snaps it to its grid as usual. Turn
   it off under Settings → 🆎 AusBoss → Canvas. In the Nodes 2.0 look, resizing
-  a node does not snap yet. If another pack's snapping is on, such as
-  Pixaroma's Align, AusBoss leaves the dragging to it.
+  a node does not snap yet. If another pack's snapping is on, AusBoss leaves
+  the dragging to it.
 
 - **Line up nodes and groups from the selection toolbar.** Select two or more
   nodes or groups and a Line up button pops out a small panel: line up edges or

CONTRIBUTING.md

@@ -198,6 +198,11 @@ example_workflows/  # example workflows (regular workflow JSON, not API JSON)
   (`tests/canvas_passthrough.test.mjs` lists the few that exist). After a
   change to a node face, `scripts/dev/wheel_sweep.mjs` turns the wheel at
   every point of every node and must find no dead spot, in both renderers.
+- For compact panel actions and preview switches, use `compactAction` and
+  `panelSwitch` from `js/shared/panel_controls.mjs`. That module owns their
+  appearance, section caption styles, and common file and save labels. A
+  node styles its layout locally; leave the shared control's face to the
+  component. Its selectors only match explicitly named AusBoss controls.
 - Every INT and FLOAT a public node exposes reaches the user as a scrub
   control, Adobe-style: drag the value to scrub, click to type, chevron
   arrows step, Shift is always the fine step. Use `makeScrubInput` from
@@ -340,7 +345,17 @@ before a release that follows a ComfyUI update.
 
 A new `version` in `pyproject.toml` that lands on main publishes to the Comfy
 Registry through the publish workflow (`.github/workflows/publish_action.yml`).
-Contributors never change `version`.
+After a successful upload, the same workflow tags that commit and creates a
+GitHub Release with the full changelog section. The README badge links to the
+latest GitHub Release. If only that step fails, rerun the failed jobs to retry
+it without uploading the Registry version again. Existing releases are left
+unchanged on a rerun. Contributors never change `version`.
+
+For an authorized release, update both `pyproject.toml` and
+`AUSBOSS_JS_VERSION`, date the changelog section, then run
+`python scripts/release_badge.py`. Preflight rejects a badge that does not
+match the pack version. Its SVG lives in the repository so the release
+number stays visible when an external badge service is unavailable.
 
 The Registry shows notes with each version. They are that version's section
 of `CHANGELOG.md`, one line per entry: its bold opening, and for a new node

README.md

@@ -3,12 +3,13 @@
   <p>ComfyUI nodes for image and video work.</p>
   <p>
     <img src="https://img.shields.io/badge/license-MIT-blue?style=flat-square" alt="MIT License">
-    <!-- Dynamic: shields.io reads the version out of pyproject.toml on main
-         at view time, so this badge can never go stale. release_preflight.py
-         checks it stays the dynamic kind. -->
-    <img src="https://img.shields.io/badge/dynamic/toml?url=https%3A%2F%2Fraw.githubusercontent.com%2Fausboss%2FComfyUI-AusBoss%2Fmain%2Fpyproject.toml&query=%24.project.version&label=release&color=00b4aa&style=flat-square" alt="Release">
+    <!-- Generated by scripts/release_badge.py. Release preflight checks
+         the badge against pyproject.toml so it cannot silently go stale. -->
+    <a href="https://github.com/ausboss/ComfyUI-AusBoss/releases/latest"><img src="assets/readme/release.svg" alt="Latest release"></a>
     <a href="https://www.youtube.com/@ausbossdev"><img src="https://img.shields.io/badge/YouTube-%40ausbossdev-00b4aa?style=flat-square&logo=youtube&logoColor=white" alt="YouTube @ausbossdev"></a>
     <a href="https://discord.gg/RwVxY9Fuaj"><img src="https://img.shields.io/badge/Discord-AusBoss-00b4aa?style=flat-square&logo=discord&logoColor=white" alt="Discord: AusBoss"></a>
+    <a href="https://huggingface.co/ausboss"><img src="https://img.shields.io/badge/Hugging%20Face-ausboss-00b4aa?style=flat-square&logo=huggingface&logoColor=white" alt="Hugging Face: ausboss"></a>
+    <a href="https://x.com/Zanzibased"><img src="https://img.shields.io/badge/X-%40Zanzibased-00b4aa?style=flat-square&logo=x&logoColor=white" alt="X @Zanzibased"></a>
   </p>
 </div>
 
@@ -28,7 +29,7 @@ Most of them are for image and video work. ComfyUI's core nodes already cover th
 - **[LoRA Loader](#lora-loader):** a whole LoRA stack in one node, each row with its own switch and strength.
 - **[Workflow Switches](#workflow-switches):** turn parts of a workflow off and on from one small card.
 
-The **?** in a node's title bar opens a short card with its inputs and outputs, and every node has a longer help page in ComfyUI's node help panel. I post the workflows I make with them on [Civitai](https://civitai.com/user/AusBoss) and [X @Zanzibased](https://x.com/Zanzibased), and videos of them on [YouTube @ausbossdev](https://www.youtube.com/@ausbossdev). Can't open Civitai? All my workflows are on [my Discord](https://discord.gg/RwVxY9Fuaj) too. If a node saves you time, a star on the repo helps other people find it.
+The **?** in a classic node's title bar opens a short card with its inputs and outputs. In Nodes 2.0, right-click the node and choose **About this node**. Every node also has a longer help page in ComfyUI's node help panel. I post the workflows I make with them on [Civitai](https://civitai.com/user/AusBoss) and [X @Zanzibased](https://x.com/Zanzibased), and videos of them on [YouTube @ausbossdev](https://www.youtube.com/@ausbossdev). Can't open Civitai? All my workflows are on [my Discord](https://discord.gg/RwVxY9Fuaj) too. If a node saves you time, a star on the repo helps other people find it.
 
 ## Install
 
@@ -66,9 +67,9 @@ The pack uses the Pillow, NumPy, Torch and PyAV that come with ComfyUI. Each exa
 
 Rotate, crop and pad a picture by dragging handles on the node. Cyan squares crop, orange diamonds pad, and the green handle rotates. It rotates first, then crops, then pads. The full-screen editor adds exact sizes, zoom and pan.
 
-Tap a ratio under the preview to pad the picture to it, or to crop it with **Fit** set to crop. A lit ratio is the shape the canvas has right now: drag a handle to another shape and it goes dark, and the row says Custom. The padlock at the end of the row keeps the shape while you drag, and the button at the start turns the shape between portrait and landscape. **Reset crop** brings back the whole picture, and **Divisible by** makes the width and height divide evenly by a number such as 8, 16 or 32, for models that need it. Feather and output resizing are on the node and in the editor.
+Open **Crop, pad & resize** under the preview and tap a ratio to pad the picture to it, or to crop it with **Fit** set to crop. A lit ratio is the shape the canvas has right now: drag a handle to another shape and it goes dark, and the row says Custom. The padlock at the end of the row keeps the shape while you drag, and the button at the start turns the shape between portrait and landscape. **Reset crop** brings back the whole picture, and **Divisible by** makes the width and height divide evenly by a number such as 8, 16 or 32, for models that need it. Feather and output resizing are on the node and in the editor.
 
-It returns the `image`, a `mask` of everything the model paints (padding, see-through parts of the source and the corners a rotation opens up), a `stitcher`, the untransformed `original`, the output `width` and `height`, and a `prompt_image`. Wire the stitcher into **Stitch Inpaint** after the sampler to put your original back. By default, see-through parts of a PNG, such as a cutout's missing background, are filled like the padding and painted; `prompt_image` and `original` show them as white. Give `prompt_image` to whatever writes your prompt, so it describes a real backdrop instead of the gray fill. **Load Image + Pad** has more fill choices and a separate reference output.
+It returns the `image`, a `mask` of everything the model paints (padding, see-through parts of the source and the corners a rotation opens up), a `stitcher`, the untouched `original`, the output `width` and `height`, and a `prompt_image`. Wire the stitcher into **Stitch Inpaint** after the sampler to put your original back. See-through parts of a PNG, such as a cutout's missing background, are filled like the padding and painted; `prompt_image` and `original` show them as white. Give `prompt_image` to whatever writes your prompt, so it describes a real backdrop instead of the gray fill. **Load Image + Pad** has more fill choices and a separate reference output.
 
 ![The full-screen image editor with a rotated lake photo, cyan crop handles, orange padding handles, aspect ratios, and dimension controls.](assets/readme/image-editor.webp)
 
@@ -78,9 +79,9 @@ Krea 2 Rotate + Outpaint turns a photo, pads it and paints the new area in one p
 
 ### Load Image + Pad
 
-Makes a canvas for outpainting: drag the edges out to add room around a picture. The Source list shows the picture under the pointer. The new area can be a solid color, the average color of the nearest edge, the edge pixels smeared outward, a blurred copy of the picture, or a mirror of it. The card also has a seam feather, a canvas multiple and a megapixel budget, and **Exact padding** opens one control per side. A budget of 0 skips resizing, though the canvas multiple can still trim a few pixels; anything higher resizes the picture before padding. A picture wired into `source_image` is padded instead of the chosen file.
+Makes a canvas for outpainting: drag the edges out to add room around a picture. The Source list shows the picture under the pointer. The new area can be a solid color, the average color of the nearest edge, the edge pixels smeared outward, a blurred copy of the picture, or a mirror of it. The card also has a seam feather, a canvas multiple and a megapixel budget, and **Exact padding** opens one control per side. A budget of 0 keeps the picture's size, and anything higher resizes the picture before padding. A picture wired into `source_image` is padded instead of the chosen file.
 
-It returns the padded `image`, a `mask` of the padding, `width`, `height`, a `stitcher`, and an unpadded `reference` for the model, fitted to a multiple of 16 and shrunk if needed. Wire the stitcher into **Stitch Inpaint** after the sampler, and everything outside the seam stays your original picture.
+It returns the padded `image`, a `mask` of the padding, `width`, `height`, a `stitcher`, and a smaller unpadded `reference` for the model. Wire the stitcher into **Stitch Inpaint** after the sampler, and everything outside the seam stays your original picture.
 
 The Klein 9B Outpaint example pads its picture with Load Image + Pad. [Open the Klein 9B Outpaint workflow →](example_workflows/Klein%209B%20Outpaint%20%28AusBoss%29.json)
 
@@ -100,7 +101,7 @@ An optional mask is resized the same way. It returns `image`, `mask`, `width` an
 
 Sets the size of the finished picture in megapixels and cuts your picture into tiles a model can redraw one at a time. A picture that fits in one tile stays whole, and a small picture is not redrawn far past the detail it has. Send the tiles through your sampler, then into Tiled Upscale Stitch with the stitcher.
 
-Megapixels is the one control to set. Under More are the tile size, the overlap, the grid multiple and the redraw limit, and an upscale model can be plugged in. It returns `tiles`, `stitcher`, `before` (your picture resized the plain way to the finished size), `width`, `height` and a `report` that says what was done.
+Megapixels is the one control to set. Under More are the tile size, the overlap, the grid multiple and the redraw limit, and an upscale model can be plugged in. It returns `tiles`, `stitcher`, `before` (your picture enlarged the plain way to the finished size), `width`, `height` and a `report` that says what was done.
 
 ### Tiled Upscale Stitch
 
@@ -162,19 +163,25 @@ Upload a video, or pick one from the Source list, which plays the clip under the
 
 It returns the frames, audio, frame count, fps, width, height, duration and a core `VIDEO`. Only the part you kept is decoded, and it checks memory before a large load. When you save the frames, wire its fps into the save node.
 
+### Load Audio
+
+Upload a sound file, or pick one from the Source list, and the node shows it as a wave. Drag the IN and OUT handles to keep only the part you want, or type the times. Press play to hear just that part. Set **Max length** to the longest sound the next step can take, such as a video's length: anything past it turns red and is cut off, so you see what comes out before you run. Click the red length next to OUT to move OUT to the cut.
+
+It returns the `audio` you kept and its length in `seconds`. Only that part is decoded. [Help page](js/docs/AUSBOSS_NODES_LoadAudio.md).
+
 ### Video Crop + Rotate + Pad → Frame
 
 Picks one frame from a video, then gives you the same rotate, crop and pad controls as the image node, plus an optional megapixel resize. Scrub to the frame with the playhead on the node; the editor adds frame-by-frame stepping and playback. It returns the transformed `image`, a `mask` of the added area, a `stitcher`, the chosen `original` frame, and the output `width` and `height`. For a whole clip, use the Clip version below.
 
 ### Video Crop + Rotate + Pad → Clip
 
-Applies one rotate, crop and pad to every frame of a trimmed clip. It has the source picker, a timeline with a playhead and frame-accurate IN and OUT handles, frame skipping, a Length control, the transform handles and output resizing. While you drag a trim handle, the node shows the exact first or last frame the run keeps. The bright part of the selection is what gets output.
+Applies one rotate, crop and pad to every frame of a trimmed clip. It has the source picker, a timeline with a playhead and frame-accurate IN and OUT handles, frame skipping, a frame limit, the transform handles and output resizing. While you drag a trim handle, the node shows the exact first or last frame the run keeps. The bright part of the selection is what gets output.
 
-Fill, feather and the resize budget sit on the node face, and a new clip keeps them. That matters for video outpainting, because the black, hard-edged canvas the model needs survives a source swap. A fresh Clip node starts with that canvas, and the editor's **Reset transform** goes back to it. **Frames for** trims the end to the frame count the next video model takes: LTX (8n+1) or Wan (4n+1). Tap a ratio to pad the clip to it; a new clip is padded to the lit ratio too. The padlock keeps the shape while you drag a handle.
+Fill, feather and the resize budget are in **Crop, pad & resize** below the timeline, and a new clip keeps them. That matters for video outpainting, because the black, hard-edged canvas the model needs survives a source swap. A fresh Clip node starts with that canvas, and the editor's **Reset transform** goes back to it. **Frames for** trims the end to the frame count the next video model takes: LTX (8n+1) or Wan (4n+1). Tap a ratio to pad the clip to it; a new clip is padded to the lit ratio too. The padlock keeps the shape while you drag a handle.
 
 It returns the frames, mask, audio, frame count, fps, size, duration, a `stitcher`, and the chosen `original` frames before the transform. **Inpaint & Stitch** in the editor sets the protected source area and previews the blend. After a video outpaint, wire the stitcher straight into **Stitch Inpaint**, with no Crop For Inpaint in between. It works in chunks to keep memory down.
 
-**Length** sets a number of output frames from IN. Drag IN or the small middle grip to move the window; drag OUT or type the count to change its length. The count stays when you choose a new clip, but the source can end before it is reached. For an exact count, link `fixed_frames`: 120 frames at 24 fps is five seconds. A positive value overrides OUT/`end_frame`, Length, `frame_load_cap` and Frames for; 0 turns it off. The source must be long enough, and IN can move earlier near the end so the window fits.
+**Fixed frames** sets an exact output length: 120 frames at 24 fps is five seconds. Drag either handle, or drag the highlighted band to move the whole window. Type the count, or link a frame count into `fixed_frames`. 0 turns the fixed length off. The frame limit still caps the length.
 
 ![The full-screen video editor with a portrait clip padded to landscape, an Inpaint and Stitch panel, and a timeline with IN and OUT handles.](assets/readme/video-editor.webp)
 
@@ -194,7 +201,7 @@ It returns the new frames and their fps. It doesn't touch audio, so carry the so
 
 Saves a frame batch or a core `VIDEO` as MP4 (H.264 or H.265), WebM (VP9 or AV1), ProRes MOV, lossless FFV1 MKV, GIF or WebP. Which encoders you get depends on your FFmpeg and PyAV build, and H.264 and H.265 come in CPU and NVENC versions. The videos carry color tags, and optionally audio and the workflow.
 
-**Ping-pong** plays forward and then back without repeating the turnaround frames. A wired `VIDEO` brings its own frame rate; otherwise wire fps from Load Video or Frame Interpolate. The player on the node shows the saved file, and **STEPS** shows the clip's first frame while it is being made, with a **STOP** button. Drop a saved video back on the canvas to load the workflow inside it, for the formats that can hold one. The [help page](js/docs/AUSBOSS_NODES_SaveVideo.md) has the format and audio details.
+**Ping-pong** plays forward and then back without repeating the turnaround frames. A wired `VIDEO` brings its own frame rate; otherwise wire fps from Load Video or Frame Interpolate. The player on the node shows the saved file, and **Preview steps** shows the clip's first frame while it is being made, with a **STOP** button. Drop a saved video back on the canvas to load the workflow inside it, for the formats that can hold one. The [help page](js/docs/AUSBOSS_NODES_SaveVideo.md) has the format and audio details.
 
 ## Mask and inpaint nodes
 
@@ -307,7 +314,7 @@ It returns `width`, `height` and an empty image latent. The gear picks the laten
 
 ### Layout Boxes
 
-Draw boxes on a canvas and say what goes in each one: a thing, or words to write in the picture. Wire `elements` to MOSS-Image Layout Prompt and the picture puts each thing where its box is. It shares the `background`, `bboxes`, `width` and `height` inputs with ComfyUI's own Create Bounding Boxes. For the same boxes, its first three outputs match, with `mask` added after them. It saves its boxes in its own `layout` text, and its canvas also works in the classic node look.
+Draw boxes on a canvas and say what goes in each one: a thing, or words to write in the picture. Wire `elements` to MOSS-Image Layout Prompt and the picture puts each thing where its box is. It does what ComfyUI's own Create Bounding Boxes does, with the same inputs and the same outputs from the same boxes, and its canvas also works in the classic node look.
 
 Drag to draw a box, drag it to move it and its handles to size it; under the canvas each box gets **object** or **text**, its words and up to five colors. A picture on `background` shows under the boxes and sets the canvas size, `width` and `height` can come from Latent Size, and boxes on the `bboxes` wire fill the canvas when the workflow runs. **Grid** snaps the boxes as you drag them, starts off over a picture and takes its size from the gear, **Layouts** starts from a ready arrangement, the arrow keys move the chosen box one pixel at a time (ten with Shift), and Delete and Ctrl + D remove and copy it.
 
@@ -321,7 +328,7 @@ One seed for several samplers. **Random**, **Fixed** and **Step** set what happe
 
 ### Select Every Nth
 
-Keeps every nth picture of a batch, after an offset that counts from 0. With nth 2, offset 0 keeps frames 1, 3 and 5, and offset 1 keeps 2, 4 and 6. The order stays the same. Wire the batch's fps in, and the `fps` output is divided by nth, so the thinned clip keeps its playback speed. Offset removes the start, and rounding to whole frames can change the duration.
+Keeps every nth picture of a batch, after an offset that counts from 0. With nth 2, offset 0 keeps frames 1, 3 and 5, and offset 1 keeps 2, 4 and 6. The order stays the same. Wire the batch's fps in, and the `fps` output is divided by nth, so the thinned clip still lasts as long.
 
 ### Split Batch
 
@@ -339,9 +346,11 @@ A text box that grows with the node and sends its text, unchanged, down a `STRIN
 
 Type what happens, one line for each moment, and leave a blank line to cut to a new place. Connect up to four pictures and give each one a job: a person, a place, an outfit, a thing or a style. Copy the moves from a video, keep a clip going, or add a voice or a song. A timeline on the node shows when each moment plays before you run it. It needs no extra model and you never see H3's prompt format. Connect a small text model and it fills in a one-line idea.
 
+**Change something** edits the named part of a video while keeping its person and sound. For a person swap, an optional `@1 looks like ...` line describes the connected replacement. Jobs that keep the source clip's length show **From the clip**; the `keeps_clip_sound` output helps a workflow choose the source audio.
+
 ### Integer
 
-One whole number (`INT`) on a scrub control, for sharing a size, count or other whole number across nodes. It takes a typed sum: `1024*1.5`.
+One whole number (`INT`) on a scrub control, for sharing a size, count or other whole number across nodes. Like every number box in the pack, it takes a typed sum: `1024*1.5`.
 
 ### Float
 
@@ -367,6 +376,10 @@ A setup card for a shared workflow: a title, instructions in Markdown, each mode
 
 A note for the canvas whose text grows to fill it, so it reads without zooming in. Double-click to type; a blank line starts a new point and `**two stars**` stress a word. Type an arrow emoji such as ⬆️ and it turns into a teal arrow in the middle of the line. Click a node while you edit, then press an arrow, and the arrow is linked to that node: click it later and the canvas brings the node into view. It never runs and has no wires.
 
+### Compact note and link tiles
+
+**Callout Tile** shows a compact title or colored YouTube/Discord link button. **Workflow Note Tile** opens a full help note from a compact button. They reuse the note editors and save as distinct node types, so an older install reports a missing node instead of drawing an incompatible plain note. Install or update ComfyUI-AusBoss, restart ComfyUI and reload when either tile is missing. Existing ordinary notes and callouts keep their original types.
+
 ### Run Timer
 
 A stopwatch for the whole run, with no wires. It starts when the queue starts running, holds the total when the run ends, and saves the last time with the workflow. Recent times are in its right-click menu. You can resize it. It only shows time and doesn't change how the graph runs.
@@ -422,7 +435,7 @@ People who download your workflow get the nodes through ComfyUI-Manager's missin
 
 ## Pack-wide tools
 
-- **Help cards:** the **?** in a node's title bar opens its description, inputs and outputs. Run Timer has no title bar, so it has **About this node** in its right-click menu.
+- **Help cards:** the **?** in a classic node's title bar opens its description, inputs and outputs. Nodes 2.0 and titleless nodes such as Run Timer have **About this node** in their right-click menu.
 - **Recreate node 🆎** (right-click an AusBoss node) rebuilds a node saved by an older version from the current definition. It keeps the values, links, position and colors.
 - **Replace with AusBoss nodes 🆎** (canvas right-click or the command palette) finds third-party nodes this pack can stand in for, such as VideoHelperSuite's Load Video and Video Combine or KJNodes' Color Match. It previews each swap and replaces the ones you leave ticked.
 - **Snap into line:** a node, group or selection you drag lines up with the nodes and groups around it, edge to edge or middle to middle, and a teal line shows what it lines up with. Pulling a corner to resize lines up the same way. Hold Shift while you drag to skip it, or turn it off in Settings → 🆎 AusBoss → Canvas.
@@ -437,7 +450,7 @@ People who download your workflow get the nodes through ComfyUI-Manager's missin
 - Hold Shift while you turn the green rotation handle to snap to 15° steps.
 - In the full-screen editor, the mouse wheel zooms, and the middle mouse button or Alt-drag pans. On the node itself, the wheel and middle mouse button still move the graph.
 - **Alt+E** opens the selected node's transform editor. Change the key in Settings → Keybindings.
-- The video editors have frame stepping, playback and exact timeline seeking, on the node face as well as in the editor. The Clip node's IN and OUT handles sit on the source's own frames and show the first and last frames the run keeps.
+- The video editors have frame stepping, playback and exact timeline seeking, on the node face as well as in the editor. The Clip node's IN and OUT handles sit on the source's own frames, so the frame shown for IN is the first one decoded and the frame shown for OUT is the last.
 - Your own aspect presets go in `ausboss_presets.json` beside the pack. Copy [`ausboss_presets_example.json`](ausboss_presets_example.json) to start. Your file survives updates.
 
 LoRA Loader and Latent Size have their own gear menus for per-node preferences.
@@ -446,7 +459,7 @@ The video transform nodes read a video you pick from a list of ComfyUI's input f
 
 ## Optional extras
 
-These optional features need an extra Python package. Install it with the Python that runs ComfyUI. For the Windows portable build, that is `python_embeded\python.exe -m pip install ...` from the portable folder.
+Three features need an extra Python package. Install it with the Python that runs ComfyUI. For the Windows portable build, that is `python_embeded\python.exe -m pip install ...` from the portable folder.
 
 ```bash
 python -m pip install opencv-contrib-python   # Mask Refine: guided filter

__init__.py

@@ -11,7 +11,7 @@ of taking the whole pack down, so one broken node never hides the rest.
 
 import importlib
 import os
-import re
+import tomllib
 import traceback
 
 # One entry per file in nodes/, kept alphabetical. The order has no
@@ -36,6 +36,7 @@ NODE_MODULES = [
     "node_layout_boxes",
     "node_literals",
     "node_load_image_pad",
+    "node_load_audio",
     "node_load_video",
     "node_lora_loader",
     "node_mask_by_name",
@@ -84,9 +85,9 @@ def _read_version():
     """Version straight from pyproject.toml so it is never duplicated."""
     try:
         pyproject = os.path.join(os.path.dirname(__file__), "pyproject.toml")
-        with open(pyproject, "r", encoding="utf-8") as f:
-            match = re.search(r'^version\s*=\s*"([^"]+)"', f.read(), re.MULTILINE)
-        return match.group(1) if match else "unknown"
+        with open(pyproject, "rb") as f:
+            version = tomllib.load(f).get("project", {}).get("version")
+        return version if isinstance(version, str) and version.strip() else "unknown"
     except Exception:
         return "unknown"
 

assets/readme/release.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="105" height="20" role="img" aria-label="release: v2.23.0">
+  <title>release: v2.23.0</title>
+  <path fill="#555" d="M0 0h48v20H0z"/>
+  <path fill="#00b4aa" d="M48 0h57v20H48z"/>
+  <g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" font-size="11">
+    <text x="24" y="14">release</text>
+    <text x="76.5" y="14">v2.23.0</text>
+  </g>
+</svg>

example_workflows/Krea 2 Inpaint Masked (AusBoss).json

@@ -1913,7 +1913,7 @@
               "The painted area, grown a little, is filled with flat gray, so Krea 2 knows where to paint. The plain crop goes along too."
             ],
             "widgets_values_named": {
-              "text": "The painted area, grown a little, is filled with flat gray. Krea 2 never sees what you are replacing."
+              "text": "The painted area, grown a little, is filled with flat gray, so Krea 2 knows where to paint. The plain crop goes along too."
             },
             "color": "#1f2c38",
             "bgcolor": "#2a3b4a"
@@ -3052,7 +3052,7 @@
               "The gray-filled crop is the reference. Painting starts from the plain crop, inside the noise mask: the painted area, widened by 24 px."
             ],
             "widgets_values_named": {
-              "text": "The gray-filled crop is the reference. The noise mask is the grown painted area, widened by 24 px. Krea 2 paints only inside it."
+              "text": "The gray-filled crop is the reference. Painting starts from the plain crop, inside the noise mask: the painted area, widened by 24 px."
             },
             "color": "#1f2c38",
             "bgcolor": "#2a3b4a"
@@ -3482,4 +3482,4 @@
     "frontendVersion": "1.53.6"
   },
   "version": 0.4
-}
+}

example_workflows/Krea 2 Rotate + Outpaint (AusBoss).json

@@ -2139,10 +2139,10 @@
             "title": "Note",
             "properties": {},
             "widgets_values": [
-              "Blend in fades the model's picture into yours just inside its edge, with no tone shift. The new area stays as painted."
+              "Blend in fades the model's picture into yours just inside its edge. Tone match is fully on, so the new area is adjusted to your picture's tone."
             ],
             "widgets_values_named": {
-              "text": "Blend in fades the model's picture into yours just inside its edge, with no tone shift. The new area stays as painted."
+              "text": "Blend in fades the model's picture into yours just inside its edge. Tone match is fully on, so the new area is adjusted to your picture's tone."
             },
             "color": "#1f2c38",
             "bgcolor": "#2a3b4a"

example_workflows/Mask by Touch (AusBoss).json

@@ -439,7 +439,7 @@
     0,
     0,
     0,
-    true,
+    false,
     "stop the run",
     false,
     false,
@@ -451,7 +451,7 @@
     "grow": 0,
     "soften": 0,
     "smooth": 0,
-    "fill_holes": true,
+    "fill_holes": false,
     "if_nothing": "stop the run",
     "free_vram": false,
     "invert": false,

example_workflows/Qwen Image 2.1 Inpaint (AusBoss).json

@@ -37,10 +37,10 @@
     "Node name for S&R": "AUSBOSS_NODES_WorkflowNote"
    },
    "widgets_values": [
-    "{\"v\": 1, \"title\": \"Qwen Image 2.1 Inpaint\", \"subtitle\": \"Click a thing in your picture and say what to change. Only that part is repainted.\", \"author\": \"AusBoss\", \"layout\": \"card\", \"accent\": \"\", \"body\": \"1. Load your image. You can crop it right there with the blue handles.\\n2. On **Mask by Touch**, click the thing you want to change. It lights up before you click.\\n3. In **What to change**, say it the way you would ask a person: \\\"Replace the cup with a glass of orange juice.\\\"\\n4. Press **Run**.\\n\\nOnly the picked part is repainted. Everything outside it stays your own picture.\\n\\n### Tips\\n- Wrong thing picked? The arrows under the picture swap it for the next thing it could mean.\\n- Name everything that should go: \\\"the iced coffee and its straw\\\". What you do not name can stay.\\n- To remove something, pick it and write \\\"Remove the cup.\\\" Pick its shadow too, or the shadow stays.\\n- To add something, switch to **Paint** and paint where it should go, with some room. Say how big: \\\"Add small black sunglasses on her eyes.\\\"\\n- Not what you wanted? Run it again. The seed changes each run.\\n\\n### Switches\\n- **Fast** on: 8 steps with the Viggle Turbo LoRA from the list below. Off: 25 steps without it, about twice as long.\\n\\nNeeds ComfyUI 0.38 or newer and AusBoss nodes 2.12.0 or newer (update first).\", \"models\": [{\"name\": \"qwen_image_2.1_int8_convrot.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"7.26 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/diffusion_models/qwen_image_2.1_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_8b_int8_convrot.safetensors\", \"dir\": \"text_encoders\", \"size\": \"9.35 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/text_encoders/qwen3vl_8b_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_2.1_vae_bf16.safetensors\", \"dir\": \"vae\", \"size\": \"676 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/vae/qwen_image_2.1_vae_bf16.safetensors\", \"note\": \"\"}, {\"name\": \"sam3.1_multiplex_fp16.safetensors\", \"dir\": \"checkpoints\", \"size\": \"1.75 GB\", \"url\": \"https://huggingface.co/Comfy-Org/sam3.1/resolve/main/checkpoints/sam3.1_multiplex_fp16.safetensors\", \"note\": \"by Meta, packaged by Comfy-Org\"}, {\"name\": \"Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"dir\": \"loras\", \"size\": \"680 MB\", \"url\": \"https://huggingface.co/Viggle/Qwen-Image-2.1-viggle-turbo/resolve/main/Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"note\": \"optional, for Fast · Qwen Research License, research use\"}], \"packs\": [{\"name\": \"ComfyUI-AusBoss\", \"url\": \"https://github.com/ausboss/ComfyUI-AusBoss\", \"node\": \"AUSBOSS_NODES_MaskByTouch\"}], \"links\": [{\"label\": \"YouTube · this workflow\", \"url\": \"https://youtu.be/iMgaiXoB0v4\"}, {\"label\": \"GitHub · ausboss\", \"url\": \"https://github.com/ausboss\"}, {\"label\": \"Civitai · AusBoss\", \"url\": \"https://civitai.com/user/AusBoss\"}, {\"label\": \"X · Zanzibased\", \"url\": \"https://x.com/Zanzibased\"}]}"
+    "{\"v\": 1, \"title\": \"Qwen Image 2.1 Inpaint\", \"subtitle\": \"Click a thing in your picture and say what to change. Only that part is repainted.\", \"author\": \"AusBoss\", \"layout\": \"card\", \"accent\": \"\", \"body\": \"1. Load your image. You can crop it right there with the blue handles.\\n2. On **Mask by Touch**, click the thing you want to change. It lights up before you click.\\n3. In **What to change**, say it the way you would ask a person: \\\"Replace the cup with a glass of orange juice.\\\"\\n4. Press **Run**.\\n\\nOnly the picked part is repainted. Everything outside it stays your own picture.\\n\\n### Tips\\n- Wrong thing picked? The arrows under the picture swap it for the next thing it could mean.\\n- Name everything that should go: \\\"the iced coffee and its straw\\\". What you do not name can stay.\\n- To remove something, pick it and write \\\"Remove the cup.\\\" Pick its shadow too, or the shadow stays.\\n- To add something, switch to **Paint** and paint where it should go, with some room. Say how big: \\\"Add small black sunglasses on her eyes.\\\"\\n- Not what you wanted? Change **Seed** and run it again. It stays fixed between runs.\\n\\n### Switches\\n- **Fast** on: 8 steps with the Viggle Turbo LoRA from the list below. Off: 25 steps without it, about twice as long.\\n\\nNeeds ComfyUI 0.38 or newer and AusBoss nodes 2.12.0 or newer (update first).\", \"models\": [{\"name\": \"qwen_image_2.1_int8_convrot.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"7.26 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/diffusion_models/qwen_image_2.1_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_8b_int8_convrot.safetensors\", \"dir\": \"text_encoders\", \"size\": \"9.35 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/text_encoders/qwen3vl_8b_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_2.1_vae_bf16.safetensors\", \"dir\": \"vae\", \"size\": \"676 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/vae/qwen_image_2.1_vae_bf16.safetensors\", \"note\": \"\"}, {\"name\": \"sam3.1_multiplex_fp16.safetensors\", \"dir\": \"checkpoints\", \"size\": \"1.75 GB\", \"url\": \"https://huggingface.co/Comfy-Org/sam3.1/resolve/main/checkpoints/sam3.1_multiplex_fp16.safetensors\", \"note\": \"by Meta, packaged by Comfy-Org\"}, {\"name\": \"Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"dir\": \"loras\", \"size\": \"680 MB\", \"url\": \"https://huggingface.co/Viggle/Qwen-Image-2.1-viggle-turbo/resolve/main/Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"note\": \"optional, for Fast · Qwen Research License, research use\"}], \"packs\": [{\"name\": \"ComfyUI-AusBoss\", \"url\": \"https://github.com/ausboss/ComfyUI-AusBoss\", \"node\": \"AUSBOSS_NODES_MaskByTouch\"}], \"links\": [{\"label\": \"YouTube · this workflow\", \"url\": \"https://youtu.be/iMgaiXoB0v4\"}, {\"label\": \"GitHub · ausboss\", \"url\": \"https://github.com/ausboss\"}, {\"label\": \"Civitai · AusBoss\", \"url\": \"https://civitai.com/user/AusBoss\"}, {\"label\": \"X · Zanzibased\", \"url\": \"https://x.com/Zanzibased\"}]}"
    ],
    "widgets_values_named": {
-    "note": "{\"v\": 1, \"title\": \"Qwen Image 2.1 Inpaint\", \"subtitle\": \"Click a thing in your picture and say what to change. Only that part is repainted.\", \"author\": \"AusBoss\", \"layout\": \"card\", \"accent\": \"\", \"body\": \"1. Load your image. You can crop it right there with the blue handles.\\n2. On **Mask by Touch**, click the thing you want to change. It lights up before you click.\\n3. In **What to change**, say it the way you would ask a person: \\\"Replace the cup with a glass of orange juice.\\\"\\n4. Press **Run**.\\n\\nOnly the picked part is repainted. Everything outside it stays your own picture.\\n\\n### Tips\\n- Wrong thing picked? The arrows under the picture swap it for the next thing it could mean.\\n- Name everything that should go: \\\"the iced coffee and its straw\\\". What you do not name can stay.\\n- To remove something, pick it and write \\\"Remove the cup.\\\" Pick its shadow too, or the shadow stays.\\n- To add something, switch to **Paint** and paint where it should go, with some room. Say how big: \\\"Add small black sunglasses on her eyes.\\\"\\n- Not what you wanted? Run it again. The seed changes each run.\\n\\n### Switches\\n- **Fast** on: 8 steps with the Viggle Turbo LoRA from the list below. Off: 25 steps without it, about twice as long.\\n\\nNeeds ComfyUI 0.38 or newer and AusBoss nodes 2.12.0 or newer (update first).\", \"models\": [{\"name\": \"qwen_image_2.1_int8_convrot.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"7.26 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/diffusion_models/qwen_image_2.1_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_8b_int8_convrot.safetensors\", \"dir\": \"text_encoders\", \"size\": \"9.35 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/text_encoders/qwen3vl_8b_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_2.1_vae_bf16.safetensors\", \"dir\": \"vae\", \"size\": \"676 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/vae/qwen_image_2.1_vae_bf16.safetensors\", \"note\": \"\"}, {\"name\": \"sam3.1_multiplex_fp16.safetensors\", \"dir\": \"checkpoints\", \"size\": \"1.75 GB\", \"url\": \"https://huggingface.co/Comfy-Org/sam3.1/resolve/main/checkpoints/sam3.1_multiplex_fp16.safetensors\", \"note\": \"by Meta, packaged by Comfy-Org\"}, {\"name\": \"Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"dir\": \"loras\", \"size\": \"680 MB\", \"url\": \"https://huggingface.co/Viggle/Qwen-Image-2.1-viggle-turbo/resolve/main/Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"note\": \"optional, for Fast · Qwen Research License, research use\"}], \"packs\": [{\"name\": \"ComfyUI-AusBoss\", \"url\": \"https://github.com/ausboss/ComfyUI-AusBoss\", \"node\": \"AUSBOSS_NODES_MaskByTouch\"}], \"links\": [{\"label\": \"YouTube · this workflow\", \"url\": \"https://youtu.be/iMgaiXoB0v4\"}, {\"label\": \"GitHub · ausboss\", \"url\": \"https://github.com/ausboss\"}, {\"label\": \"Civitai · AusBoss\", \"url\": \"https://civitai.com/user/AusBoss\"}, {\"label\": \"X · Zanzibased\", \"url\": \"https://x.com/Zanzibased\"}]}"
+    "note": "{\"v\": 1, \"title\": \"Qwen Image 2.1 Inpaint\", \"subtitle\": \"Click a thing in your picture and say what to change. Only that part is repainted.\", \"author\": \"AusBoss\", \"layout\": \"card\", \"accent\": \"\", \"body\": \"1. Load your image. You can crop it right there with the blue handles.\\n2. On **Mask by Touch**, click the thing you want to change. It lights up before you click.\\n3. In **What to change**, say it the way you would ask a person: \\\"Replace the cup with a glass of orange juice.\\\"\\n4. Press **Run**.\\n\\nOnly the picked part is repainted. Everything outside it stays your own picture.\\n\\n### Tips\\n- Wrong thing picked? The arrows under the picture swap it for the next thing it could mean.\\n- Name everything that should go: \\\"the iced coffee and its straw\\\". What you do not name can stay.\\n- To remove something, pick it and write \\\"Remove the cup.\\\" Pick its shadow too, or the shadow stays.\\n- To add something, switch to **Paint** and paint where it should go, with some room. Say how big: \\\"Add small black sunglasses on her eyes.\\\"\\n- Not what you wanted? Change **Seed** and run it again. It stays fixed between runs.\\n\\n### Switches\\n- **Fast** on: 8 steps with the Viggle Turbo LoRA from the list below. Off: 25 steps without it, about twice as long.\\n\\nNeeds ComfyUI 0.38 or newer and AusBoss nodes 2.12.0 or newer (update first).\", \"models\": [{\"name\": \"qwen_image_2.1_int8_convrot.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"7.26 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/diffusion_models/qwen_image_2.1_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_8b_int8_convrot.safetensors\", \"dir\": \"text_encoders\", \"size\": \"9.35 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/text_encoders/qwen3vl_8b_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_2.1_vae_bf16.safetensors\", \"dir\": \"vae\", \"size\": \"676 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/vae/qwen_image_2.1_vae_bf16.safetensors\", \"note\": \"\"}, {\"name\": \"sam3.1_multiplex_fp16.safetensors\", \"dir\": \"checkpoints\", \"size\": \"1.75 GB\", \"url\": \"https://huggingface.co/Comfy-Org/sam3.1/resolve/main/checkpoints/sam3.1_multiplex_fp16.safetensors\", \"note\": \"by Meta, packaged by Comfy-Org\"}, {\"name\": \"Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"dir\": \"loras\", \"size\": \"680 MB\", \"url\": \"https://huggingface.co/Viggle/Qwen-Image-2.1-viggle-turbo/resolve/main/Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"note\": \"optional, for Fast · Qwen Research License, research use\"}], \"packs\": [{\"name\": \"ComfyUI-AusBoss\", \"url\": \"https://github.com/ausboss/ComfyUI-AusBoss\", \"node\": \"AUSBOSS_NODES_MaskByTouch\"}], \"links\": [{\"label\": \"YouTube · this workflow\", \"url\": \"https://youtu.be/iMgaiXoB0v4\"}, {\"label\": \"GitHub · ausboss\", \"url\": \"https://github.com/ausboss\"}, {\"label\": \"Civitai · AusBoss\", \"url\": \"https://civitai.com/user/AusBoss\"}, {\"label\": \"X · Zanzibased\", \"url\": \"https://x.com/Zanzibased\"}]}"
    },
    "color": "#14424d",
    "bgcolor": "#161f21"

example_workflows/Qwen Image 2.1 Upscale + Restore (AusBoss).json

@@ -37,10 +37,10 @@
     "ver": "2.9.0"
    },
    "widgets_values": [
-    "{\"v\": 1, \"title\": \"Qwen Image 2.1 Upscale + Restore\", \"subtitle\": \"Load a small, soft or worn picture. Qwen Image 2.1 redraws it sharp at the megapixels you set, in its own colors.\", \"author\": \"AusBoss\", \"layout\": \"card\", \"accent\": \"\", \"body\": \"[▶ AusBoss on YouTube](https://www.youtube.com/@ausbossdev) · videos on these nodes and workflows\\n\\n---\\n\\n1. Load your image. You can crop it right there with the blue handles.\\n2. Set **Megapixels**: the size of the result.\\n3. Press **Run**.\\n4. Slide **Before and after** to compare. The result is saved as a PNG.\\n\\n### What you get\\n\\n- Your picture redrawn sharp, at the size you asked for.\\n- Its own colors, also on a noisy or faded photo.\\n\\n### Megapixels\\n\\n- Up to about 2: one pass.\\n- Over that: redrawn in tiles of about 2 megapixels and joined. 4 takes two tiles, 8 takes four.\\n- A small picture is redrawn at up to 8 times its own megapixels, then enlarged the plain way.\\n- A picture of 1 megapixel or more only looks better when it grows about 1.6 times per side.\\n\\n### Switches\\n\\n- **Fast** on: 8 steps with the Viggle Turbo LoRA. Off: 25 steps without it, about three times as long.\\n\\n### Tips\\n\\n- It is a redraw. Fine detail is made up to fit, so a face stays the same person, not the same pixels.\\n- Small lettering on signs and labels can come back misspelled.\\n- Each tile is matched to your picture's colors. To let Qwen's own colors through, lower **Keep colors** inside the box.\\n- If the run stops at a red **LoRA Loader**, a LoRA that is switched on is missing. Download it from the list below.\\n- Not tested on blur from a moving camera or missed focus.\\n\\nNeeds ComfyUI 0.38 or newer and AusBoss nodes 2.9.0 or newer (update first).\", \"models\": [{\"name\": \"qwen_image_2.1_int8_convrot.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"7.26 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/diffusion_models/qwen_image_2.1_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_8b_int8_convrot.safetensors\", \"dir\": \"text_encoders\", \"size\": \"9.35 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/text_encoders/qwen3vl_8b_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_2.1_vae_bf16.safetensors\", \"dir\": \"vae\", \"size\": \"676 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/vae/qwen_image_2.1_vae_bf16.safetensors\", \"note\": \"\"}, {\"name\": \"qwen-image-2.1-restore.safetensors\", \"dir\": \"loras\", \"size\": \"159 MB\", \"url\": \"https://huggingface.co/ausboss/Qwen-Image-2.1-Restore-LoRA/resolve/main/qwen-image-2.1-restore.safetensors\", \"note\": \"keeps the result close to your picture\"}, {\"name\": \"Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"dir\": \"loras\", \"size\": \"680 MB\", \"url\": \"https://huggingface.co/Viggle/Qwen-Image-2.1-viggle-turbo/resolve/main/Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"note\": \"for Fast on · Qwen Research License, research use\"}], \"packs\": [{\"name\": \"ComfyUI-AusBoss\", \"url\": \"https://github.com/ausboss/ComfyUI-AusBoss\", \"node\": \"AUSBOSS_NODES_TiledUpscale\"}], \"links\": [{\"label\": \"YouTube · ausbossdev\", \"url\": \"https://www.youtube.com/@ausbossdev\"}, {\"label\": \"GitHub · ausboss\", \"url\": \"https://github.com/ausboss\"}, {\"label\": \"Civitai · AusBoss\", \"url\": \"https://civitai.com/user/AusBoss\"}, {\"label\": \"X · Zanzibased\", \"url\": \"https://x.com/Zanzibased\"}]}"
+    "{\"v\": 1, \"title\": \"Qwen Image 2.1 Upscale + Restore\", \"subtitle\": \"Load a small, soft or worn picture. Qwen Image 2.1 redraws it sharp at the megapixels you set, in its own colors.\", \"author\": \"AusBoss\", \"layout\": \"card\", \"accent\": \"\", \"body\": \"[▶ AusBoss on YouTube](https://www.youtube.com/@ausbossdev) · videos on these nodes and workflows\\n\\n---\\n\\n1. Load your image. You can crop it right there with the blue handles.\\n2. Set **Megapixels**: the size of the result.\\n3. Press **Run**.\\n4. Slide **Before and after** to compare. The result is saved as a PNG.\\n\\n### What you get\\n\\n- Your picture redrawn sharp, at the size you asked for.\\n- Its own colors, also on a noisy or faded photo.\\n\\n### Megapixels\\n\\n- Up to about 2: one pass.\\n- Over that: redrawn in tiles of about 2 megapixels and joined. 4 takes two tiles, 8 takes four.\\n- The redraw limit for a small picture is 8 times its own megapixels or one roughly 2 megapixel tile, whichever is larger. The rest is enlarged the plain way.\\n- A picture of 1 megapixel or more only looks better when it grows about 1.6 times per side.\\n\\n### Switches\\n\\n- **Fast** on: 8 steps with the Viggle Turbo LoRA. Off: 25 steps without it, about three times as long.\\n\\n### Tips\\n\\n- It is a redraw. Fine detail is made up to fit, so a face stays the same person, not the same pixels.\\n- Small lettering on signs and labels can come back misspelled.\\n- Each tile is matched to your picture's colors. To let Qwen's own colors through, lower **Keep colors** inside the box.\\n- If the run stops at a red **LoRA Loader**, a LoRA that is switched on is missing. Download it from the list below.\\n- Not tested on blur from a moving camera or missed focus.\\n\\nNeeds ComfyUI 0.38 or newer and AusBoss nodes 2.9.0 or newer (update first).\", \"models\": [{\"name\": \"qwen_image_2.1_int8_convrot.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"7.26 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/diffusion_models/qwen_image_2.1_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_8b_int8_convrot.safetensors\", \"dir\": \"text_encoders\", \"size\": \"9.35 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/text_encoders/qwen3vl_8b_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_2.1_vae_bf16.safetensors\", \"dir\": \"vae\", \"size\": \"676 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/vae/qwen_image_2.1_vae_bf16.safetensors\", \"note\": \"\"}, {\"name\": \"qwen-image-2.1-restore.safetensors\", \"dir\": \"loras\", \"size\": \"159 MB\", \"url\": \"https://huggingface.co/ausboss/Qwen-Image-2.1-Restore-LoRA/resolve/main/qwen-image-2.1-restore.safetensors\", \"note\": \"keeps the result close to your picture\"}, {\"name\": \"Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"dir\": \"loras\", \"size\": \"680 MB\", \"url\": \"https://huggingface.co/Viggle/Qwen-Image-2.1-viggle-turbo/resolve/main/Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"note\": \"for Fast on · Qwen Research License, research use\"}], \"packs\": [{\"name\": \"ComfyUI-AusBoss\", \"url\": \"https://github.com/ausboss/ComfyUI-AusBoss\", \"node\": \"AUSBOSS_NODES_TiledUpscale\"}], \"links\": [{\"label\": \"YouTube · ausbossdev\", \"url\": \"https://www.youtube.com/@ausbossdev\"}, {\"label\": \"GitHub · ausboss\", \"url\": \"https://github.com/ausboss\"}, {\"label\": \"Civitai · AusBoss\", \"url\": \"https://civitai.com/user/AusBoss\"}, {\"label\": \"X · Zanzibased\", \"url\": \"https://x.com/Zanzibased\"}]}"
    ],
    "widgets_values_named": {
-    "note": "{\"v\": 1, \"title\": \"Qwen Image 2.1 Upscale + Restore\", \"subtitle\": \"Load a small, soft or worn picture. Qwen Image 2.1 redraws it sharp at the megapixels you set, in its own colors.\", \"author\": \"AusBoss\", \"layout\": \"card\", \"accent\": \"\", \"body\": \"[▶ AusBoss on YouTube](https://www.youtube.com/@ausbossdev) · videos on these nodes and workflows\\n\\n---\\n\\n1. Load your image. You can crop it right there with the blue handles.\\n2. Set **Megapixels**: the size of the result.\\n3. Press **Run**.\\n4. Slide **Before and after** to compare. The result is saved as a PNG.\\n\\n### What you get\\n\\n- Your picture redrawn sharp, at the size you asked for.\\n- Its own colors, also on a noisy or faded photo.\\n\\n### Megapixels\\n\\n- Up to about 2: one pass.\\n- Over that: redrawn in tiles of about 2 megapixels and joined. 4 takes two tiles, 8 takes four.\\n- A small picture is redrawn at up to 8 times its own megapixels, then enlarged the plain way.\\n- A picture of 1 megapixel or more only looks better when it grows about 1.6 times per side.\\n\\n### Switches\\n\\n- **Fast** on: 8 steps with the Viggle Turbo LoRA. Off: 25 steps without it, about three times as long.\\n\\n### Tips\\n\\n- It is a redraw. Fine detail is made up to fit, so a face stays the same person, not the same pixels.\\n- Small lettering on signs and labels can come back misspelled.\\n- Each tile is matched to your picture's colors. To let Qwen's own colors through, lower **Keep colors** inside the box.\\n- If the run stops at a red **LoRA Loader**, a LoRA that is switched on is missing. Download it from the list below.\\n- Not tested on blur from a moving camera or missed focus.\\n\\nNeeds ComfyUI 0.38 or newer and AusBoss nodes 2.9.0 or newer (update first).\", \"models\": [{\"name\": \"qwen_image_2.1_int8_convrot.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"7.26 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/diffusion_models/qwen_image_2.1_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_8b_int8_convrot.safetensors\", \"dir\": \"text_encoders\", \"size\": \"9.35 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/text_encoders/qwen3vl_8b_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_2.1_vae_bf16.safetensors\", \"dir\": \"vae\", \"size\": \"676 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/vae/qwen_image_2.1_vae_bf16.safetensors\", \"note\": \"\"}, {\"name\": \"qwen-image-2.1-restore.safetensors\", \"dir\": \"loras\", \"size\": \"159 MB\", \"url\": \"https://huggingface.co/ausboss/Qwen-Image-2.1-Restore-LoRA/resolve/main/qwen-image-2.1-restore.safetensors\", \"note\": \"keeps the result close to your picture\"}, {\"name\": \"Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"dir\": \"loras\", \"size\": \"680 MB\", \"url\": \"https://huggingface.co/Viggle/Qwen-Image-2.1-viggle-turbo/resolve/main/Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"note\": \"for Fast on · Qwen Research License, research use\"}], \"packs\": [{\"name\": \"ComfyUI-AusBoss\", \"url\": \"https://github.com/ausboss/ComfyUI-AusBoss\", \"node\": \"AUSBOSS_NODES_TiledUpscale\"}], \"links\": [{\"label\": \"YouTube · ausbossdev\", \"url\": \"https://www.youtube.com/@ausbossdev\"}, {\"label\": \"GitHub · ausboss\", \"url\": \"https://github.com/ausboss\"}, {\"label\": \"Civitai · AusBoss\", \"url\": \"https://civitai.com/user/AusBoss\"}, {\"label\": \"X · Zanzibased\", \"url\": \"https://x.com/Zanzibased\"}]}"
+    "note": "{\"v\": 1, \"title\": \"Qwen Image 2.1 Upscale + Restore\", \"subtitle\": \"Load a small, soft or worn picture. Qwen Image 2.1 redraws it sharp at the megapixels you set, in its own colors.\", \"author\": \"AusBoss\", \"layout\": \"card\", \"accent\": \"\", \"body\": \"[▶ AusBoss on YouTube](https://www.youtube.com/@ausbossdev) · videos on these nodes and workflows\\n\\n---\\n\\n1. Load your image. You can crop it right there with the blue handles.\\n2. Set **Megapixels**: the size of the result.\\n3. Press **Run**.\\n4. Slide **Before and after** to compare. The result is saved as a PNG.\\n\\n### What you get\\n\\n- Your picture redrawn sharp, at the size you asked for.\\n- Its own colors, also on a noisy or faded photo.\\n\\n### Megapixels\\n\\n- Up to about 2: one pass.\\n- Over that: redrawn in tiles of about 2 megapixels and joined. 4 takes two tiles, 8 takes four.\\n- The redraw limit for a small picture is 8 times its own megapixels or one roughly 2 megapixel tile, whichever is larger. The rest is enlarged the plain way.\\n- A picture of 1 megapixel or more only looks better when it grows about 1.6 times per side.\\n\\n### Switches\\n\\n- **Fast** on: 8 steps with the Viggle Turbo LoRA. Off: 25 steps without it, about three times as long.\\n\\n### Tips\\n\\n- It is a redraw. Fine detail is made up to fit, so a face stays the same person, not the same pixels.\\n- Small lettering on signs and labels can come back misspelled.\\n- Each tile is matched to your picture's colors. To let Qwen's own colors through, lower **Keep colors** inside the box.\\n- If the run stops at a red **LoRA Loader**, a LoRA that is switched on is missing. Download it from the list below.\\n- Not tested on blur from a moving camera or missed focus.\\n\\nNeeds ComfyUI 0.38 or newer and AusBoss nodes 2.9.0 or newer (update first).\", \"models\": [{\"name\": \"qwen_image_2.1_int8_convrot.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"7.26 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/diffusion_models/qwen_image_2.1_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_8b_int8_convrot.safetensors\", \"dir\": \"text_encoders\", \"size\": \"9.35 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/text_encoders/qwen3vl_8b_int8_convrot.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_2.1_vae_bf16.safetensors\", \"dir\": \"vae\", \"size\": \"676 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Qwen-Image-2.1/resolve/main/vae/qwen_image_2.1_vae_bf16.safetensors\", \"note\": \"\"}, {\"name\": \"qwen-image-2.1-restore.safetensors\", \"dir\": \"loras\", \"size\": \"159 MB\", \"url\": \"https://huggingface.co/ausboss/Qwen-Image-2.1-Restore-LoRA/resolve/main/qwen-image-2.1-restore.safetensors\", \"note\": \"keeps the result close to your picture\"}, {\"name\": \"Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"dir\": \"loras\", \"size\": \"680 MB\", \"url\": \"https://huggingface.co/Viggle/Qwen-Image-2.1-viggle-turbo/resolve/main/Qwen-Image-2.1-viggle-turbo-v0.3-6step-lora-r128.safetensors\", \"note\": \"for Fast on · Qwen Research License, research use\"}], \"packs\": [{\"name\": \"ComfyUI-AusBoss\", \"url\": \"https://github.com/ausboss/ComfyUI-AusBoss\", \"node\": \"AUSBOSS_NODES_TiledUpscale\"}], \"links\": [{\"label\": \"YouTube · ausbossdev\", \"url\": \"https://www.youtube.com/@ausbossdev\"}, {\"label\": \"GitHub · ausboss\", \"url\": \"https://github.com/ausboss\"}, {\"label\": \"Civitai · AusBoss\", \"url\": \"https://civitai.com/user/AusBoss\"}, {\"label\": \"X · Zanzibased\", \"url\": \"https://x.com/Zanzibased\"}]}"
    },
    "color": "#14424d",
    "bgcolor": "#161f21"

js/appearance/index.js

@@ -1,4 +1,4 @@
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import {
   CUSTOM_SCHEME,
   DEFAULT_SCHEME,
@@ -23,6 +23,7 @@ import { openInfoCard } from "../shared/settings_menu.mjs";
 
 const SETTING_ID = "AusBoss.Appearance.NodeColor";
 const CUSTOM_SETTING_ID = "AusBoss.Appearance.CustomColor";
+const COLOR_OVERRIDE = "ausbossColor";
 
 // Stored bare (no "#") to match the color setting's storage contract.
 const DEFAULT_CUSTOM_COLOR = "00b4aa";
@@ -40,6 +41,7 @@ let activeCustomColor = DEFAULT_CUSTOM_COLOR;
 let activeCustomTitle = normalizeHexColor(DEFAULT_CUSTOM_COLOR);
 
 function setActiveCustomColor(value) {
+  if (!normalizeHexColor(value)) return;
   activeCustomColor = value;
   activeCustomTitle = normalizeHexColor(value);
 }
@@ -56,6 +58,7 @@ function applyScheme(node, colors) {
 function repaintAll(next, previous) {
   for (const node of collectGraphNodes(app.graph)) {
     if (!isAusbossNode(node)) continue;
+    if (Object.hasOwn(node.properties ?? {}, COLOR_OVERRIDE)) continue;
     if (!shouldRecolor(node, previous)) continue;
     applyScheme(node, next);
   }
@@ -149,8 +152,8 @@ app.registerExtension({
   },
   getNodeMenuItems(node) {
     if (!isAusbossNode(node)) return [];
-    // A title-less node has no bar for the "?" badge; its card opens here.
-    const about = isTitleless(node)
+    // Vue nodes skip the canvas badge callbacks; title-less nodes have no bar.
+    const about = isTitleless(node) || globalThis.LiteGraph?.vueNodesMode === true
       ? [{ content: "About this node", callback: () => openHelpCard(node, null) }]
       : [];
     return [
@@ -162,12 +165,14 @@ app.registerExtension({
           options: SCHEME_NAMES.map((name) => ({
             content: name,
             callback: () => {
-              // A menu pick writes the colors directly; shouldRecolor then
-              // treats them as the user's choice during setting sweeps.
+              // Keep an explicit choice, including no colors, through saves
+              // and setting changes. Custom stores the pair picked today.
               const colors = schemeColors(name, activeCustomColor);
               // Custom with an unusable stored color resolves to null, which
               // would wrongly read as "Theme default" — do nothing instead.
               if (name === CUSTOM_SCHEME && !colors) return;
+              node.properties ??= {};
+              node.properties[COLOR_OVERRIDE] = colors ? { ...colors } : null;
               applyScheme(node, colors);
               app.graph?.setDirtyCanvas?.(true, true);
             },
@@ -179,18 +184,28 @@ app.registerExtension({
   nodeCreated(node) {
     if (!isAusbossNode(node)) return;
     installHelpBadge(node);
-    // Colors restored from a saved workflow (and manual picks) land before
-    // this hook runs — an already-colored node is left alone, unless it
-    // wears a retired flagship pair: those colors were ours, so the node
-    // upgrades to the active scheme instead of keeping them forever.
-    if ((node.color || node.bgcolor) && !wearsLegacyScheme(node)) return;
-    const colors = schemeColors(activeScheme, activeCustomColor);
-    if (colors) applyScheme(node, colors);
+    restoreAppearance(node);
+    // Construction precedes saved fields; reload, paste and undo restore
+    // their colors and properties before this callback runs.
+    chainCallback(node, "onConfigure", function (saved) {
+      restoreAppearance(this, saved);
+    });
   },
 });
 
+function restoreAppearance(node, saved) {
+  if (Object.hasOwn(node.properties ?? {}, COLOR_OVERRIDE)) {
+    // A later pick in ComfyUI's own color menu is saved in the native fields.
+    if (saved?.color || saved?.bgcolor) return;
+    applyScheme(node, node.properties[COLOR_OVERRIDE]);
+    return;
+  }
+  if ((node.color || node.bgcolor) && !wearsLegacyScheme(node)) return;
+  applyScheme(node, schemeColors(activeScheme, activeCustomColor));
+}
+
 function isTitleless(node) {
-  return node.constructor?.title_mode === (globalThis.LiteGraph?.NO_TITLE ?? 1);
+  return (node.title_mode ?? node.constructor?.title_mode) === (globalThis.LiteGraph?.NO_TITLE ?? 1);
 }
 
 function openHelpCard(node, event) {
@@ -204,15 +219,13 @@ function openHelpCard(node, event) {
   });
 }
 
-// Every AusBoss node gets a quiet "?" in the title bar; clicking it opens a
-// card built from the node's own DESCRIPTION and tooltips, so the docs on
-// screen are exactly the docs in the source.
+// Classic nodes get a quiet "?" in the title bar. Vue nodes open the same
+// card from their context menu. Its text comes from DESCRIPTION and tooltips.
 function installHelpBadge(node) {
   // A title-less node (Run Timer) has no bar to hang the badge on; its
   // card opens from the node's context menu instead.
-  if (isTitleless(node)) return;
   chainCallback(node, "onDrawForeground", function (ctx) {
-    if (!showBadge(this.size?.[0] ?? 0, this.flags?.collapsed)) return;
+    if (isTitleless(this) || !showBadge(this.size?.[0] ?? 0, this.flags?.collapsed)) return;
     const [x, y] = badgeCenter(this.size[0]);
     ctx.save();
     ctx.beginPath();
@@ -228,7 +241,7 @@ function installHelpBadge(node) {
     ctx.restore();
   });
   chainHandler(node, "onMouseDown", function (event, pos) {
-    if (!showBadge(this.size?.[0] ?? 0, this.flags?.collapsed)) return false;
+    if (isTitleless(this) || !showBadge(this.size?.[0] ?? 0, this.flags?.collapsed)) return false;
     if (!pos || !hitsBadge(pos, this.size[0])) return false;
     openHelpCard(this, event);
     return true; // consume the click so it does not start a drag

js/cache_guard/index.js

@@ -4,8 +4,8 @@
 //
 // Imports nothing from ../shared on purpose. Old cached copies of those files
 // are the problem this entry has to survive.
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 
 const PACK_URL = new URL("../", import.meta.url).href;
 const PARALLEL = 6;

js/callout/index.js

@@ -6,7 +6,9 @@
 // and copy ride the default path); the panel only shows it. Decisions live in
 // js/shared/callout.mjs under node:test.
 
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
+import { setTileFace, TILE_FACE_CSS } from "../shared/tile_face.mjs";
+import { CALLOUT_TYPES, serializeNoteIdentity } from "../shared/note_identity.mjs";
 import { BRAND, chainCallback, keepDomWidgetWidthAuto } from "../shared/index.mjs";
 import {
   ARROW_ANGLE,
@@ -19,6 +21,8 @@ import {
   repointLinks,
   targetId,
   toggleSmall,
+  tileLinkFields,
+  tileLinkText,
   urlLabel,
   wrapLink,
 } from "../shared/callout.mjs";
@@ -27,9 +31,9 @@ import { keepKeyInField } from "../shared/canvas_passthrough.mjs";
 import { WIDGET_FRAME, fillNodeHeight } from "../shared/panel_layout.mjs";
 import { hideInputsInDef, hideWidget } from "../shared/widget_visibility.mjs";
 import { commitWidgetValue } from "../shared/widget_card_math.mjs";
+import { compactAction } from "../shared/panel_controls.mjs";
 import { frameBounds } from "../shared/workflow_switches.mjs";
 
-const NODE_CLASS = "AUSBOSS_NODES_Callout";
 const CSS_ID = "ausboss-callout-css";
 const WIDGET_NAME = "ausboss_callout_panel";
 const DEFAULT_SIZE = [380, 160];
@@ -37,6 +41,10 @@ const PANEL_MIN_WIDTH = 200;
 const PANEL_MIN_HEIGHT = 64;
 const SVG_NS = "http://www.w3.org/2000/svg";
 const ARROW_COLOR = "#1fd3c6";
+const LINK_TILES = {
+  youtube: { label: "Watch Me on YouTube", url: "https://www.youtube.com/@ausbossdev" },
+  discord: { label: "Join for Help or More Workflows", url: "https://discord.gg/RwVxY9Fuaj" },
+};
 const FRAME_FILL = 0.8; // the share of the view a node brought into view takes, as in Workflow Switches
 const FONT = '"IBM Plex Sans", "Inter", "Segoe UI", system-ui, -apple-system, sans-serif';
 
@@ -55,6 +63,7 @@ function ensureCss() {
   const style = document.createElement("style");
   style.id = CSS_ID;
   style.textContent = `
+${TILE_FACE_CSS}
 .ausboss-callout{box-sizing:border-box;width:100%;height:100%;padding:2px 4px 6px;overflow:hidden;pointer-events:none;}
 .ausboss-callout-card{position:relative;box-sizing:border-box;width:100%;height:100%;overflow:hidden;border-radius:8px;background:linear-gradient(135deg,rgba(0,180,170,.07),rgba(0,0,0,.2));}
 .ausboss-callout-inner{position:absolute;top:0;bottom:0;left:0;box-sizing:border-box;width:100%;height:fit-content;margin:auto 0;padding:.6em 1em .6em .85em;color:#d6e6e4;font-family:${FONT};font-weight:500;line-height:1.4;letter-spacing:.003em;overflow-wrap:anywhere;}
@@ -63,6 +72,15 @@ function ensureCss() {
 .ausboss-callout-point b{color:#6fe0d6;font-weight:650;}
 .ausboss-callout-small{margin-top:.3em;color:#9fb5b2;font-size:max(11px,.62em);font-weight:400;line-height:1.4;}
 .ausboss-callout-small b{color:#8fd6cf;font-weight:600;}
+.ausboss-callout-card[data-tile=youtube]{background:#ae2639}
+.ausboss-callout-card[data-tile=discord]{background:#5146aa}
+.ausboss-callout-card[data-tile=title]{background:#090909;border-left:4px solid #21c7b9}
+.ausboss-callout-card[data-tile] .ausboss-callout-inner{padding-block:.15em;}
+.ausboss-callout-card[data-tile] .ausboss-callout-point{border:0;padding:0;margin:0;font-weight:650;color:#fff}
+.ausboss-callout-card[data-tile] .ausboss-callout-url{color:white;text-decoration:none;display:flex;align-items:center;gap:12px}
+.ausboss-callout-card[data-tile] .ausboss-callout-url svg{width:36px;height:28px;flex:none}
+.ausboss-callout-card[data-tile] .ausboss-callout-out{margin-left:auto}
+.ausboss-callout-card[data-tile] .ausboss-callout-tools{right:27px;}
 .ausboss-callout-empty{color:#6f8987;font-size:14px;font-weight:400;}
 .ausboss-callout-arrow{display:inline-block;width:1.2em;height:1.2em;margin:0 .1em;vertical-align:-.26em;filter:drop-shadow(0 0 .3em rgba(0,180,170,.55));}
 .ausboss-callout-arrow svg{display:block;width:100%;height:100%;overflow:visible;}
@@ -75,7 +93,7 @@ function ensureCss() {
 .ausboss-callout-out{display:inline-block;margin-left:.2em;font-size:.7em;font-weight:600;vertical-align:.14em;text-decoration:none;opacity:.85;}
 .ausboss-callout-jump.is-gone{opacity:.45;cursor:default;text-decoration-style:dotted;}
 .ausboss-callout-tools{position:absolute;top:5px;right:5px;display:flex;gap:4px;opacity:0;transition:opacity .15s;pointer-events:auto;}
-.ausboss-callout-card:hover .ausboss-callout-tools,.ausboss-callout.is-selected .ausboss-callout-tools{opacity:.95;}
+.ausboss-callout-card:is(:hover,:focus-within) .ausboss-callout-tools,.ausboss-callout.is-selected .ausboss-callout-tools{opacity:.95;}
 .ausboss-callout-tool{height:22px;padding:0 8px;border:1px solid rgba(0,180,170,.45);border-radius:5px;background:rgba(8,14,16,.86);color:#9fd8d3;font:600 11px ${FONT};letter-spacing:.02em;cursor:pointer;}
 .ausboss-callout-tool:hover{color:#fff;border-color:${BRAND};}
 .ausboss-callout-editor{position:absolute;inset:0;box-sizing:border-box;display:flex;flex-direction:column;gap:6px;padding:6px;border:1px solid ${BRAND};border-radius:8px;background:rgba(5,10,11,.95);pointer-events:auto;container-type:size;}
@@ -90,6 +108,17 @@ function ensureCss() {
 .ausboss-callout-pick svg{display:block;width:100%;height:100%;}
 .ausboss-callout-size{flex:none;height:24px;margin-left:4px;padding:0 7px;border:1px solid rgba(0,180,170,.35);border-radius:5px;background:rgba(8,14,16,.9);color:#9fd8d3;font:600 11px ${FONT};cursor:pointer;}
 .ausboss-callout-size:hover{border-color:${BRAND};background:rgba(0,180,170,.14);}
+.ausboss-tile-editor{box-sizing:border-box;width:min(520px,94vw);max-height:86vh;overflow:auto;margin:auto;padding:24px;border:1px solid #365957;border-top:3px solid ${BRAND};border-radius:10px;background:#111b1c;color:#e6f4f3;box-shadow:0 18px 64px #0008;font:14px/1.5 ${FONT};}
+.ausboss-tile-editor::backdrop{background:#06090ab8;}
+.ausboss-tile-editor h2{margin:0 0 18px;font-size:21px;}
+.ausboss-tile-editor label{display:flex;flex-direction:column;gap:7px;margin-bottom:16px;font-weight:600;}
+.ausboss-tile-editor input,.ausboss-tile-editor textarea{box-sizing:border-box;width:100%;padding:10px 12px;border:1px solid #365957;border-radius:5px;background:#080e10;color:#e6f4f3;font:16px/1.5 ${FONT};user-select:text;}
+.ausboss-tile-editor textarea{min-height:120px;resize:vertical;}
+.ausboss-tile-editor :is(input,textarea):focus{outline:2px solid ${BRAND};outline-offset:1px;}
+.ausboss-tile-editor footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;}
+.ausboss-tile-editor footer span{margin-right:auto;color:#99b0ad;font-size:12px;}
+.ausboss-tile-editor .ausboss-compact-action{height:32px;padding:0 15px;font-size:13px;}
+.ausboss-tile-editor .ausboss-tile-error{color:#ffc36d;margin:0 0 12px;}
 @container (max-width:395px){.ausboss-callout-arrowbar>span:first-child,.ausboss-callout-link:not(.has-node){display:none;}}
 @container (max-width:395px) and (min-height:112px){.ausboss-callout-arrowbar{flex-wrap:wrap;}.ausboss-callout-pick{flex:none;}}
 `;
@@ -177,6 +206,18 @@ function arrowSpan(state, kind, piece = {}) {
 function linkRun(state, first) {
   if (first.url !== undefined) {
     const link = el("a", "ausboss-callout-url");
+    const tile = state.card.dataset.tile;
+    if (tile === "youtube" || tile === "discord") {
+      const icon = svg("svg", { viewBox:"0 0 28 20", "aria-hidden":"true" });
+      if (tile === "youtube") {
+        icon.append(svg("rect",{x:0,y:1,width:28,height:18,rx:5,fill:"white"}),
+          svg("path",{d:"M11 5.5 19 10 11 14.5Z",fill:"#ae2639"}));
+      } else {
+        icon.append(svg("path",{d:"M4 3 10 1l1 2a15 15 0 0 1 6 0l1-2 6 2c2 4 3 8 3 12l-6 4-2-3a17 17 0 0 1-10 0l-2 3-6-4c0-4 1-8 3-12Z",fill:"white"}));
+        for (const cx of [9,19]) icon.append(svg("ellipse",{cx,cy:10,rx:2,ry:2.6,fill:"#5146aa"}));
+      }
+      link.append(icon);
+    }
     link.href = first.url;
     link.target = "_blank";
     link.rel = "noopener noreferrer";
@@ -222,6 +263,10 @@ function bringIntoView(target) {
 }
 
 function renderText(state) {
+  const style = state.node.properties?.ausbossCalloutTile;
+  if (["youtube","discord","title"].includes(style)) state.card.dataset.tile = style;
+  else delete state.card.dataset.tile;
+  setTileFace(state.node, state.root, Boolean(state.card.dataset.tile), () => startEdit(state));
   const blocks = parseBlocks(state.valueWidget.value);
   state.inner.replaceChildren();
   state.empty = blocks.length === 0;
@@ -319,7 +364,9 @@ function fit(state) {
     inner.style.fontSize = `${px}px`;
     return inner.offsetHeight <= height && inner.scrollWidth <= width + 1;
   };
-  inner.style.fontSize = `${fitFontSize(fits)}px`;
+  const size = fitFontSize(fits);
+  const social = card.dataset.tile === "youtube" || card.dataset.tile === "discord";
+  inner.style.fontSize = `${social ? Math.min(size, 16) : size}px`;
 }
 
 function markChanged() {
@@ -331,8 +378,78 @@ function markChanged() {
   }
 }
 
+function startTileEdit(state) {
+  if (state.editor) return;
+  const original = String(state.valueWidget.value ?? "");
+  const social = ["youtube", "discord"].includes(state.card.dataset.tile);
+  const link = social ? tileLinkFields(original) : null;
+  const dialog = el("dialog", "ausboss-tile-editor");
+  const heading = social ? "Edit link tile" : "Edit title";
+  dialog.setAttribute("aria-label", heading);
+  dialog.append(el("h2", "", heading));
+  const label = el("label", "", link ? "Button text" : "Text");
+  const text = el(link ? "input" : "textarea");
+  text.value = link?.label ?? original;
+  label.append(text);
+  dialog.append(label);
+  let address;
+  if (link) {
+    const field = el("label", "", "Link address");
+    address = el("input");
+    address.type = "url";
+    address.value = link.url;
+    field.append(address);
+    dialog.append(field);
+  }
+  const error = el("p", "ausboss-tile-error");
+  error.setAttribute("role", "alert");
+  const foot = el("footer");
+  const cancel = compactAction("Cancel");
+  const save = compactAction("Save");
+  foot.append(el("span", "", "Ctrl + Enter to save"), cancel, save);
+  dialog.append(error, foot);
+  const commit = () => {
+    let value = text.value;
+    try {
+      if (address) value = tileLinkText(text.value, address.value);
+    } catch (problem) {
+      error.textContent = problem.message;
+      return;
+    }
+    if (value !== original) {
+      state.node.graph?.beforeChange?.();
+      commitWidgetValue(state.node, state.valueWidget, value, app.canvas);
+      renderText(state);
+      state.node.graph?.afterChange?.();
+      markChanged();
+    }
+    dialog.close();
+  };
+  save.addEventListener("click", commit);
+  cancel.addEventListener("click", () => dialog.close());
+  dialog.addEventListener("keydown", event => {
+    event.stopPropagation();
+    if (event.key === "Enter" && (event.ctrlKey || event.metaKey)) {
+      event.preventDefault();
+      commit();
+    }
+  });
+  dialog.addEventListener("keyup", event => event.stopPropagation());
+  dialog.addEventListener("close", () => {
+    state.editor = null;
+    dialog.remove();
+    state.root.querySelector(".ausboss-callout-tool")?.focus();
+  }, { once: true });
+  state.editor = dialog;
+  document.body.append(dialog);
+  dialog.showModal();
+  text.focus();
+  text.select();
+}
+
 function startEdit(state) {
   if (state.editor) return;
+  if (state.card.dataset.tile) return startTileEdit(state);
   const wrap = el("div", "ausboss-callout-editor");
   const area = el("textarea", "ausboss-callout-edit");
   area.value = state.valueWidget.value ?? "";
@@ -499,16 +616,17 @@ function buildPanel(node) {
   root.append(card);
   tools.addEventListener("pointerdown", (event) => event.stopPropagation());
 
+  const panelHeight = () => (card.dataset.tile ? 36 : PANEL_MIN_HEIGHT) + WIDGET_FRAME;
   const domWidget = node.addDOMWidget(WIDGET_NAME, "ausboss_callout", root, {
     serialize: false,
     hideOnZoom: false,
-    getMinHeight: () => PANEL_MIN_HEIGHT + WIDGET_FRAME,
+    getMinHeight: panelHeight,
   });
   keepDomWidgetWidthAuto(domWidget);
   domWidget.serialize = false;
   fillNodeHeight(domWidget, {
     minWidth: PANEL_MIN_WIDTH,
-    minHeight: () => PANEL_MIN_HEIGHT + WIDGET_FRAME,
+    minHeight: panelHeight,
     minNodeSize: [PANEL_MIN_WIDTH, PANEL_MIN_HEIGHT + 40],
     exactMinWidth: true,
   });
@@ -516,6 +634,9 @@ function buildPanel(node) {
   const state = { node, valueWidget, domWidget, root, card, inner, empty: true, editor: null, frame: 0 };
   node.__ausbossCallout = state;
   edit.addEventListener("click", () => startEdit(state));
+  card.addEventListener("dblclick", (event) => {
+    if (card.dataset.tile && !event.target.closest("a,button,textarea,.ausboss-callout-editor")) startEdit(state);
+  });
   state.observer = new ResizeObserver(() => {
     cancelAnimationFrame(state.frame);
     state.frame = requestAnimationFrame(() => fit(state));
@@ -535,7 +656,7 @@ app.registerExtension({
     // A note copied with what its links name follows the copies.
     onPaste(({ nodes, groups, created }) => {
       for (const node of created) {
-        if (node?.comfyClass !== NODE_CLASS && node?.type !== NODE_CLASS) continue;
+        if (!CALLOUT_TYPES.has(node?.comfyClass) && !CALLOUT_TYPES.has(node?.type)) continue;
         const state = buildPanel(node);
         if (!state) continue;
         const text = repointLinks(state.valueWidget.value, nodes, groups);
@@ -546,16 +667,29 @@ app.registerExtension({
     });
   },
   beforeRegisterNodeDef(nodeType, nodeData) {
-    if (nodeData?.name !== NODE_CLASS) return;
+    if (!CALLOUT_TYPES.has(nodeData?.name)) return;
     hideInputsInDef(nodeData, ["text"]);
     chainCallback(nodeType.prototype, "onNodeCreated", function () {
+      if (nodeData.name === "AUSBOSS_NODES_CalloutTile") {
+        this.properties ??= {};
+        this.properties.ausbossCalloutTile ??= "title";
+      }
       buildPanel(this);
+      // Keep new tiles compact without changing ordinary or saved callouts.
+      if (nodeData.name === "AUSBOSS_NODES_CalloutTile") this.setSize?.([380, 80]);
     });
-    chainCallback(nodeType.prototype, "onConfigure", function () {
+    chainCallback(nodeType.prototype, "onSerialize", function (saved) {
+      serializeNoteIdentity(saved, ["youtube", "discord", "title"].includes(this.properties?.ausbossCalloutTile));
+    });
+    chainCallback(nodeType.prototype, "onConfigure", function (saved) {
       // Saved values land after onNodeCreated; show them.
       queueMicrotask(() => {
         const state = buildPanel(this);
-        if (state) renderText(state);
+        if (!state) return;
+        renderText(state);
+        if (state.card.dataset.tile && Number.isFinite(saved?.size?.[1])) {
+          this.setSize?.([this.size[0], saved.size[1]]);
+        }
       });
     });
     chainCallback(nodeType.prototype, "onDblClick", function () {
@@ -565,12 +699,24 @@ app.registerExtension({
     chainCallback(nodeType.prototype, "getExtraMenuOptions", function (_canvas, options) {
       const state = this.__ausbossCallout;
       if (!state || !Array.isArray(options)) return;
+      for (const [style, label] of [["plain","Plain callout"],["title","Title tile"],["youtube","Set YouTube link tile"],["discord","Set Discord link tile"]]) {
+        options.unshift({ content: label, callback: () => {
+          this.properties ??= {};
+          this.properties.ausbossCalloutTile = style;
+          const preset = LINK_TILES[style];
+          if (preset) commitWidgetValue(this, state.valueWidget, `[${preset.label}](${preset.url})`, app.canvas);
+          renderText(state);
+          if (style !== "plain") this.setSize?.([this.size[0], style === "title" ? 86 : 78]);
+          markChanged();
+        }});
+      }
       options.unshift({ content: "Edit callout text", callback: () => startEdit(state) }, null);
     });
     chainCallback(nodeType.prototype, "onRemoved", function () {
       const state = this.__ausbossCallout;
       if (!state) return;
       state.observer?.disconnect();
+      state.editor?.close?.();
       cancelAnimationFrame(state.frame);
       this.__ausbossCallout = null;
     });

js/canvas_passthrough/index.js

@@ -12,7 +12,7 @@
 // title it loads into the node, dropped on the node's panel (the picture, the
 // controls) it missed the node. The drop listeners here hand it to the node
 // under the pointer.
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import {
   dragCarriesFiles, graphDragStarts, panelHost, panelKeepsWheel, panelNeedsDropHelp, panelRoot,
 } from "../shared/canvas_passthrough.mjs";

js/chrome/index.js

@@ -1,5 +1,5 @@
-import { app } from "/scripts/app.js";
-import { api } from "/scripts/api.js";
+import { app } from "../../../scripts/app.js";
+import { api } from "../../../scripts/api.js";
 import { AUSBOSS_JS_VERSION, BRAND, BRAND_BODY, chainCallback } from "../shared/index.mjs";
 import { nodeByExecutionId } from "../shared/graph_ids.mjs";
 import { isOwnRun, ownRuns } from "../shared/prompt_scope.mjs";

js/compare/index.js

@@ -1,5 +1,5 @@
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { isForeignRun, outputKey } from "../shared/prompt_scope.mjs";
 import { BRAND, chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange } from "../shared/index.mjs";
 import { lookupLink } from "../shared/graph_links.mjs";
@@ -463,8 +463,9 @@ app.registerExtension({
       ]);
     });
     chainCallback(nodeType.prototype, "onConfigure", function () {
+      const state = this.__ausbossCompare;
       queueMicrotask(() => {
-        const state = buildPanel(this);
+        if (!state || this.__ausbossCompare !== state || state.abort.signal.aborted) return;
         state.showingB = this.properties?.ausboss_compare_side === "B";
         syncErase(state);
         // The saved paint, if the pictures are already up.

js/docs/AUSBOSS_NODES_Callout.md

@@ -7,9 +7,17 @@ to point at the part you are talking about.
 Use it to explain a step in a workflow you share. It never runs and has no
 wires.
 
+## Tile presets
+
+Right-click the Callout and choose **Title tile** to give your existing text a black heading with a teal accent. **Set YouTube link tile** and **Set Discord link tile** fill in the AusBoss link and label. Click the label to open the link, or drag the tile to move it. Choose **Plain callout** to return to the standard style with the current text.
+
+- Press **Edit** on a tile to open a larger editor. A link tile has separate **Button text** and **Link address** fields. Existing mixed text stays in a text box.
+- Double-click a title to edit it. **Save** or `Ctrl+Enter` keeps the change; **Cancel** or `Esc` leaves the original text.
+- Drag the visible bottom-right grip to resize. You can also focus the grip and use arrow keys; hold **Shift** for smaller changes. Resizing keeps the tile in place and supports Undo.
+
 ## Writing
 
-- Double-click the note, or press **Edit**, to type. Click outside the box to
+- On a plain callout, double-click the note, or press **Edit**, to type. Click outside the box to
   keep the text. **Esc** drops what you typed.
 - A blank line starts a new point. Each point gets a thin teal line beside it.
 - Put two stars around a word to stress it: `**Resize is on.**`

js/docs/AUSBOSS_NODES_CalloutTile.md

@@ -0,0 +1,7 @@
+# Callout Tile
+
+A compact title or colored link button for a workflow. Choose **Title tile**, **Set YouTube link tile**, or **Set Discord link tile** from its menu. Press **Edit** to change its text or link; you can also double-click a title. Drag its visible corner to resize.
+
+It uses the same text, arrows and links as [Callout](AUSBOSS_NODES_Callout.md). **Plain callout** returns to the ordinary note face. Nothing runs and it has no outputs.
+
+Tiles save with their own node type. If ComfyUI reports this node missing, install or update **ComfyUI-AusBoss**, restart ComfyUI, and reload the workflow. An older pack cannot draw the tile correctly. Keep the missing node so its text and settings are preserved.

js/docs/AUSBOSS_NODES_ColorMatch.md

@@ -17,7 +17,8 @@ reduce color drift between frames.
   **Reference** (`reference_mode`) is **first frame**.
 - **Method** (`method`): How the colors move.
   - **lab** — per-channel mean/std shift in LAB. Perceptual and the safe
-    default: adjusts overall casts and contrast. It can also change hues.
+    default: corrects overall casts and contrast without shifting
+    individual hues around.
   - **rgb** — the same mean/std shift in raw channels.
   - **mkl** — maps the full color covariance; best when hues are rotated,
     not just shifted.

js/docs/AUSBOSS_NODES_Compare.md

@@ -64,6 +64,7 @@ Pick **Erase** on the switch. A row of tools opens above the picture:
   away. Restore paints it back. Holding **Ctrl**, or using the right
   mouse button, does the other one for as long as you hold it.
 - **Size** is the brush's width, in pixels of the picture.
+- The dot beside **Size** previews one brush dab. It grows with Size and its edge fades as you increase Soft.
 - **Soft** is the brush's edge: 0 is a hard edge, 100 fades all the way
   from the middle.
 - Drag left and right on **Size** or **Soft**, on the word, the number or

js/docs/AUSBOSS_NODES_Float.md

@@ -22,8 +22,7 @@ Wired to a sampler's **denoise**, it goes from 0 to 1 and no further: type
 
 - It works through a Reroute and into a box (subgraph) too.
 - Wired to two settings, it keeps to what both allow.
-- Unwire it and it uses its own range again: -1,000,000,000,000,000 to
-  1,000,000,000,000,000, with a stored step of `0.001`.
+- Unwire it and it takes any number again.
 - A new box takes the value of the first setting you wire it to, so wiring
   it up changes nothing until you move it. A box you have already set, or
   one that came with a workflow, keeps its own value.

js/docs/AUSBOSS_NODES_H3PromptWriter.md

@@ -77,9 +77,8 @@ Some scripts, with the jobs they need:
 ```
 
 A picture that is off simply isn't counted. If a line still names it, the node
-stops and tells you which one. A plain script needs at least one picture or
-a video to start from. A prompt already written in H3's six parts can run
-without either.
+stops and tells you which one. It needs at least one picture or a video to start
+from.
 
 ## Use a video
 
@@ -90,16 +89,42 @@ Connect a video, then pick what it is for:
   `@1 dances on a rooftop at sunset.` The clothes can come from words or from an
   outfit picture.
 - **swap the person**: your person takes over from the one in the video. The
-  place, the moves and the camera stay. You can leave the box empty.
+  place, the moves and the camera stay. With two person pictures, the first
+  replaces the person on the left and the second replaces the person on the
+  right. To choose who goes, type one line per picture, for example
+  `@1 replaces the man in the hat`. Put spoken words in quotes and name
+  the speaker. If a voice comes from off screen, say so in the line.
+- **change something**: keep the video and describe the change, for example
+  `She wears a red raincoat`. Be specific about what should change.
 - **keep going**: more of the same clip, from where it ends. Say what happens
   next, or leave the box empty and it just carries on. Connect the whole clip:
   the node sends H3 only the last 2 seconds.
 - **new voice**: the same clip with a new voice. Connect the voice, and type
   what they say in quotes.
 
-Swap and new voice ignore **Length**. They use the video's frame count,
-treated as 24 fps, capped at 15 seconds and rounded down to a length H3 takes.
-This can shorten the requested result; the video output itself stays whole.
+If your swap keeps the video's audio, connect it to **video_sound** and turn on
+**More → Clip's own sound**. The writer uses the clip to estimate when each
+line is spoken and keeps only the incoming people's words in the swap prompt.
+Type a time such as `3.2s:` to set it yourself. This switch starts off.
+
+With an active video, **swap the person**, **change something** and **new voice**
+use the incoming clip to set the frame count. **Length** says **From the clip**;
+set the clip's length upstream. The bar does not show a guessed duration or offer
+retiming controls for these jobs. H3 rounds the frame count to a supported length.
+Other video jobs, or turning the video off, use the editable **Length** again.
+
+For a swap, you can optionally describe the replacement on its own line:
+
+```
+the woman with black hair walking toward the camera
+@1 looks like a woman with blonde hair and a black hoodie.
+```
+
+The first line chooses who goes; the `@1 looks like` line describes the connected
+replacement person in Picture 1. Use the number of that picture, with its job set
+to **person** or **character sheet**. This helps describe the intended appearance;
+it does not guarantee an exact identity match. The line is optional: existing
+workflows and scripts keep their previous behavior when it is absent.
 
 ## What you can type
 
@@ -122,15 +147,16 @@ This can shorten the requested result; the video output itself stays whole.
 A `camera:` or `sound:` line inside a group of lines belongs to that shot. On its
 own, with blank lines around it, it is for the whole clip.
 
-Already wrote H3's six parts yourself? Paste them in and the story is kept.
-Spacing is cleaned up. A connected voice or song still updates the audio
-parts. The Sound and Music boxes do not add to this form of prompt.
+Already wrote H3's six parts yourself? Paste them in and they go through as
+they are.
 
 ## What you can plug in
 
-- **picture_1**, **picture_2**, **picture_3**, **picture_4**: your pictures.
-- **video** and **video_sound**: the frames and the sound of a video. Only keep
-  going uses the sound.
+- **picture_1** to **picture_4**: your pictures.
+- **video** and **video_sound**: the frames and the sound of a video. **keep
+  going** sends the last part of the sound to H3. A swap uses the sound to find
+  speech timing when **Clip's own sound** is on. To keep source audio in a swap
+  or **change something**, route the original loader's audio to the save node.
 - **voice**: a clip of someone talking, about 10 seconds, plus words in quotes
   in your script. It goes to whoever speaks first. It works with your own voice,
   or one you have permission to use. Put the spoken line last: with time left
@@ -154,6 +180,12 @@ H3's width and height: the clip takes the shape of your video, or else of your
 first picture. **song_under** goes into `audio2` of Audio Merge, with the clip's
 sound in `audio1`.
 
+**keeps_clip_sound** is on when a video is connected and **Clip's own sound** is
+on, or the video job is **change something**. Use it to select the source audio
+for the finished clip. It is the last output; the existing outputs keep their
+positions. Keeping source audio still needs the workflow to pass that audio to
+its save node.
+
 Nothing plugged in means nothing is added. So a page can turn each one on and off
 with [Workflow Switches](#AUSBOSS_NODES_WorkflowSwitches): a bypassed loader reads
 as not plugged in.
@@ -163,16 +195,13 @@ as not plugged in.
 - **Sound** (`sound`): what the clip sounds like, for the whole clip. Same as a
   `sound:` line.
 - **Music** (`music`): the music for the whole clip. Same as a `music:` line.
-- **Length** (`seconds`): requested seconds, `5` to `15`, starting at `8`.
-  The `frames` output rounds this to a length H3 takes at 24 fps.
+- **Length** (`seconds`): how long the clip is, 5 to 15.
 - **Camera** (`camera`): how the camera moves the whole way through.
 - **Look** (`look`): from the picture keeps your photo's look. The others redraw
   the clip. Clay and 3D don't work from words, so change your picture first with
   an edit model.
-- **Picture 1** to **Picture 4** (`job_1`, `job_2`, `job_3`, `job_4`): what
-  each picture is for, on the picture chips under the bar. An empty slot
-  shows as a faint `+ @3`.
-  The first three start on `person`; the fourth starts on `thing`.
+- **Picture 1** to **Picture 4** (`job_1` to `job_4`): what each picture is
+  for, on the picture chips under the bar. An empty slot shows as a faint `+ @3`.
 - **Video** (`video_job`): what the video is for, on the video chip.
 - **Song starts at** (`song_start`, under **More**): the second of the song to
   start from, so the clip gets the good part.
@@ -215,19 +244,10 @@ as not plugged in.
 | `song_under` | output | AUDIO | With a voice and a song, the song to mix under the finished clip. |
 | `frames` | output | INT | The clip's length in frames. |
 | `width`, `height` | output | INT | The shape of your video, or else of your first picture. |
+| `keeps_clip_sound` | output | BOOLEAN | Whether the finished clip should use the video's own sound. |
 
 ## Technical details
 
-H3 lengths use `17n + 5` frames, with `n` at least 1. A requested length
-rounds to the nearest such count at 24 fps: `5` seconds gives `124` frames,
-and `15` gives `362`. Swap and new voice round down instead, after capping
-the source count at `360`, so their largest output length is `345` frames.
-This node has no input for the source video's fps; change its rate to
-24 fps first when its timing must match.
-
-With a six-part prompt and no pictures or video, `width` and `height` are
-`1344` and `756`. Unused picture, video and audio outputs are empty.
-
 Code does the reading, so nothing typed can be lost or moved. It follows Pika's
 and MiniMax's published prompt guides: every picture is defined once, each one
 states what is kept and how, and a person who changes clothes or moves to a new

js/docs/AUSBOSS_NODES_ImageCropRotatePad.md

@@ -10,7 +10,7 @@ original back over the result.
 
 ## Quick start
 
-1. Pick a picture under **Image source**, or click **Upload**. Dropping a
+1. Choose a file above the preview, or click **Load**. Dropping a
    picture onto the node works too.
 2. Drag the handles on the picture. Cyan squares crop. Orange diamonds add space
    on one side. Orange corners make the whole canvas bigger or smaller. The
@@ -28,22 +28,25 @@ uses what the node shows.
 
 From top to bottom:
 
-- **Image source**: the pictures in ComfyUI's input folder. The list shows the
-  picture under the pointer and filters as you type. **Upload** adds one. A
+- **File picker**: choose **Inputs** for uploaded pictures or **Outputs** for renders, newest first. The list shows the
+  picture under the pointer and filters as you type. **Load** adds one. A
   picture ComfyUI made, named like `photo.png [output]`, loads too, as it does
   in core Load Image. The gear holds the node's display options.
 - **The picture**, with its handles.
 - **The size line**: each step that sets the output size, ending with the size
   the run gives you.
-- **The ratio row**: the orientation button, the ratios (1:1, 4:3, 3:2, 16:9,
-  21:9) and the padlock.
-- **Fit** (crop | pad) and **Divisible by**.
-- **Fill**, **Feather**, **Resize** and the two **Center** buttons.
+- **Crop, pad & resize**: a collapsible group (closed to start, with the fill
+  swatch and a short summary on its bar) holding:
+  - **Aspect ratio** and **Fit to ratio** (Crop or Pad), above the orientation button, the ratios (1:1, 4:3, 3:2, 16:9,
+    21:9) and the padlock.
+  - **Align** and the two **Center** buttons.
+  - **Fill** and **Feather**.
+  - **Resize**, with **Megapixels** and **Step** alongside it when Resize is on.
 - **Open editor**, **Reset crop** and **Reset**.
 
 Crop and padding have no number boxes. You set them by dragging, and the size
 line shows the result. Picking another picture starts the framing over
-(rotation, crop and padding); Fill, Feather, Divisible by, Resize and a lit
+(rotation, crop and padding); Fill, Feather, Align, Resize and a lit
 ratio stay.
 
 ### Ratios, Fit and the padlock
@@ -51,8 +54,7 @@ ratio stay.
 Tap a ratio under the picture to pad the picture to it: every pixel stays and
 fill bands are added around it, centred. Set **Fit** to crop and the ratio trims
 the picture instead. Tap the lit ratio again to go back to the whole picture.
-**Fit** only acts on a lit ratio, so it is dimmed and says "pick a ratio first"
-until you tap one.
+You can set **Fit to ratio** before picking a ratio. If a ratio is already lit, switching between Crop and Pad applies it immediately.
 
 - **A lit ratio is the shape the canvas has now.** Drag a handle to another
   shape and the ratio goes dark; the row says **Custom** and the size line under
@@ -85,11 +87,11 @@ sides at once, so the picture keeps its place in the middle. You can press or le
 go of Alt during the drag. A corner stops when one of its two sides has no padding
 left to take away.
 
-The two **Center** buttons next to Fill, Feather and Resize put the picture in
-the middle of the canvas: one side to side, one top to bottom. They move padding from
-one side to the other, so the canvas keeps its size and a lit ratio stays lit. A
-button is dimmed when the picture is already in the middle or that way has no
-padding to move. On a narrow node they sit on a line of their own.
+**Center** moves the crop to the middle of the rotated source, side to side or
+top to bottom. If there is padding on that axis, the same click also balances
+the bands around the crop. The crop and output keep their sizes, and the
+generated mask follows the new placement. Each button dims when its axis is
+as centered as the pixels allow.
 
 The orange diamonds move one side at a time, and the padlock works on them as
 described above. The corners keep the shape with or without the padlock. The
@@ -112,9 +114,9 @@ green rotate knob moves aside when a corner handle sits where it usually goes.
   **Method** (`resize_method`) is in the editor, under **Resize output**.
   The edge between your picture and the fill stays one clean line at any size.
 
-### Divisible by
+### Align
 
-**Divisible by** (`canvas_multiple`) makes the width and height divide evenly by
+**Align** (`canvas_multiple`) makes the width and height divide evenly by
 the number you pick. Some models need sizes divisible by 8, 16 or 32. At 1 it is
 off. Its arrows go 1, 8, 16, 24 and so on; hold Shift to step by 1.
 
@@ -130,24 +132,23 @@ or bottom.
 The line under the picture names every step that sets the output size, in the
 order the run applies them, with the size the run emits last and brightest:
 `crop 2080×1170 → pad 2208×1298 → round to 64 2240×1344 → resize 1344×768`. A step
-that changes nothing is left out, and "round to" is **Divisible by** at work. An
+that changes nothing is left out, and "round to" is **Align** at work. An
 amber line warns when rounding each side to the Step stretches the picture by
-more than 1% (`1.5% taller: each side rounds to 32 px`); its tooltip names a
-Step that avoids it, and with Fit on pad, **Even out** adds a few pixels of
-padding so nothing stretches. It also warns when the resize undoes **Divisible
-by**. Hover the line for the same breakdown line by line; the editor's right
+more than 1% (`Resize makes the picture 1.5% taller`); its tooltip names a
+Step that avoids it, and with Fit on pad, **Pad to keep shape** adds a few pixels of
+padding so nothing stretches. It also warns when the resize undoes **Align**. Hover the line for the same breakdown line by line; the editor's right
 panel shows it too.
 
 The amber line keeps still while you drag a handle or a number. If the drag
 makes it untrue it goes away, and the line for the new size comes back a
-moment after you let go. With Resize on its row is always on the node, with
-text or empty, so the controls under it stay where they are.
+moment after you let go. The space for the warning stays under the dimensions. On a narrow node, hover
+over shortened text to read it in full.
 
 ### Reset crop and Reset
 
 **Reset crop** shows the whole picture again without changing rotation or
 padding. **Reset** clears rotation, crop and padding and turns the padlock off;
-Fill, Feather and **Divisible by** stay.
+Fill, Feather and **Align** stay.
 
 ## Drawing a mask
 
@@ -167,8 +168,7 @@ your picture stays under them in **image**, **original** and
 the teal.
 
 See-through parts of a PNG show in teal the same way, because the node paints
-them too. To hide the teal, click the gear at the top right of the image
-source box and turn off **Show the mask on the picture**. The choice applies
+them too. To hide the teal, click the gear next to **Load** and turn off **Show the mask on the picture**. The choice applies
 to every Image Crop + Rotate + Pad in this browser.
 
 ## Outputs
@@ -232,18 +232,18 @@ for fine steps). The editor adds a few things the node does not show:
 - **Rotate → Degrees** (`rotation_degrees`): type an exact turn, clockwise.
   Each step is 1°, or 0.1° with Shift. **Reset rotation** sets it back to 0.
 - **Padding & mask → Reset padding** removes all padding. The same section has
-  Fill, Feather, Divisible by and a **Center** row.
+  Fill, Feather, Align and a **Center** row.
 - **Resize output → Method** (`resize_method`): how the resize samples the
   picture. `lanczos`, the default, is the sharp one.
 - **More**: ratios you added in `ausboss_presets.json` that no button shows.
   The list only appears when you have some.
 - **Reset view** undoes zoom and pan. **Reset transform**
-  clears rotation, crop, padding, fill, feather and Divisible by; the picture,
+  clears rotation, crop, padding, fill, feather and Align; the picture,
   resize and stitch settings stay.
 - **Preview**: a small picture of the finished output while you work.
 
 A ratio replaces the existing crop and padding and keeps rotation, fill and
-resize settings. **Divisible by** and the resize **Step** can slightly change
+resize settings. **Align** and the resize **Step** can slightly change
 the fitted shape. The size box on the stage sits clear of the handles.
 
 ### Handles and gestures
@@ -266,30 +266,6 @@ The editor's right side holds the stitcher's settings, the same as on the clip n
   marks it. See-through parts of a PNG follow the same switch; a cutout usually stores
   black or its old background there, so leave a cutout on fill.
 
-## Transform values
-
-The handles and editor write these inputs. An API prompt can set them too.
-
-| Input | Default | What it sets |
-| --- | --- | --- |
-| `rotation_degrees` | `0` | Clockwise turn, from `-180` to `180` degrees. |
-| `crop_aspect_ratio` | `free` | Crop shape: `free`, `source`, or a width:height ratio. |
-| `crop_x`, `crop_y` | `0` | Crop's left and top, in pixels of the turned picture; `0` to `65536`. |
-| `crop_width`, `crop_height` | `0` | Crop size, `0` to `65536`; `0` keeps the available size from that position. |
-| `pad_left`, `pad_top`, `pad_right`, `pad_bottom` | `0` | Added pixels on each side, `0` to `32768`. |
-| `feather` | `24` | Mask feather in pixels, `0` to `4096`. The picture meets the fill at a hard edge. |
-| `canvas_multiple` | `1` | Size multiple, `1` to `4096`; `1` turns rounding off. |
-| `fill_color` | `#808080` | Fill for padding and empty corners. |
-| `resize_to_megapixels` | `false` | Turn the output resize on. |
-| `megapixels` | `1` | Resize budget, `0.01` to `16`; one megapixel here is 1024 × 1024 pixels. |
-| `resize_method` | `lanczos` | Resize filter: `lanczos`, `area`, `bicubic`, `bilinear`, `nearest-exact`. |
-| `resolution_steps` | `1` | Round resized sides to this multiple, `1` to `256`. |
-
-The built-in crop ratios are `1:1`, `9:16`, `16:9`, `2:3`, `3:2`,
-`3:4`, `4:3`, `9:21` and `21:9`. Other positive whole-number ratios
-are accepted too. The resize runs after the transform; its step can change
-a size that already met `canvas_multiple`.
-
 ## Technical details
 
 - **Saved values.** The handles write plain number values that save with the
@@ -304,8 +280,8 @@ a size that already met `canvas_multiple`.
   - `fill_color`: `#RGB` or `#RRGGBB`, three numbers (`R, G, B`), one gray
     number, or a colour name. Anything it cannot read becomes mid-gray.
 - **Corners.** A corner follows the pointer along the canvas diagonal, and the
-  shape it keeps is the canvas before **Divisible by** rounds it. With
-  Divisible by on, **Center** counts the fill it adds, so the bands you see
+  shape it keeps is the canvas before **Align** rounds it. With
+  Align on, **Center** counts the fill it adds, so the bands you see
   come out even.
 - **Resize.** It works like core's *Scale Image to Total Pixels*: the budget is
   `megapixels × 1024 × 1024`, the shape is kept, and each side rounds to a

js/docs/AUSBOSS_NODES_ImageFolder.md

@@ -114,9 +114,8 @@ the pictures repeat in order for as many runs as you queue.
   skipped.
 - By name means the way a person sorts: `photo_2` before `photo_10`.
 - With **Subfolders** on, a picture's `filename` carries its folder in
-  front (`trips/beach.png` gives `trips_beach`). Folder separators become
-  underscores, so names can still collide: `trips/beach.png` and
-  `trips_beach.jpg` both give `trips_beach`.
+  front (`trips/beach.png` gives `trips_beach`), so two files with one name
+  never save over each other.
 - **image**, **mask**, **filename** and **index** are lists. Pictures keep
   their own sizes. They are not resized or stacked into one batch.
 - Moving Picture on is done by the editor when a run is queued. A workflow

js/docs/AUSBOSS_NODES_Integer.md

@@ -6,8 +6,8 @@ wire it to every node that needs it.
 ## Controls
 
 - **Value** (`value`): The whole number to send out. It starts at `0`. The
-  arrows and a drag move it by 1, or click and type. Its range is listed
-  below; use Seed for the full sampler seed range.
+  arrows and a drag move it by 1, or click and type. It holds numbers as
+  big as a seed.
 - The gear, right: **Look**. **normal** is the usual box with its label.
   **big** shows the number large in the middle of the node, with an arrow
   on each side, for a setting people change on every run, such as the
@@ -22,7 +22,7 @@ Wired to a sampler's **steps**, it goes from 1 to 10000: type 0 and you get
 
 - It works through a Reroute and into a box (subgraph) too.
 - Wired to two settings, it keeps to what both allow.
-- Unwire it and it uses its own whole-number range again.
+- Unwire it and it takes any whole number again.
 - A new box takes the value of the first setting you wire it to, so wiring
   it up changes nothing until you move it. A box you have already set, or
   one that came with a workflow, keeps its own value.
@@ -42,9 +42,9 @@ For arithmetic on the way — halving a size, adding a margin — feed this into
   nearest one.
 - The limits are kept by the node's face. A value sent straight through the
   API is passed on as it is.
-- On its own the box goes from -9,007,199,254,740,991 to
-  9,007,199,254,740,991, the largest whole number a browser holds exactly.
-  It stopped at 2,147,483,647 before, which most seeds are above.
+- On its own the box goes up to 9,007,199,254,740,991, the largest whole
+  number a browser holds exactly. It stopped at 2,147,483,647 before, which
+  most seeds are above.
 - The look is stored in the node's properties as `ausboss_text_look: "big"`, the
   same as Text 🆎. It is not an input, so the saved value and what the node
   sends are the same in both looks, and an older version of the pack shows

js/docs/AUSBOSS_NODES_Krea2OutpaintModelPatch.md

@@ -82,7 +82,7 @@ new region can break up; the node says so in the console when it sees it,
 and the cure is two passes: pad one axis, run, load the result, pad the
 other. **A thin strip counts.** More than 8 px of padding on the other
 axis, such as a few pixels left over from a drag, means the source no
-longer spans it. **Divisible by** on the Crop + Rotate + Pad nodes and
+longer spans it. **Align** on the Crop + Rotate + Pad nodes and
 Load Image + Pad's **Multiple** never add a strip on a side you did not
 pad. The warning reports the spare pixels on each axis.
 

js/docs/AUSBOSS_NODES_LayoutBoxes.md

@@ -152,9 +152,8 @@ removes it. The first color also colors the box on the canvas.
 
 ## In place of Create Bounding Boxes
 
-Layout Boxes shares the `background`, `bboxes`, `width` and `height` inputs.
-Its first three outputs match Create Bounding Boxes, with `mask` after them,
-so those wires move straight over. For the same boxes it
+Layout Boxes has the same inputs and the same outputs in the same order (and
+`mask` after them), so the wires move straight over. For the same boxes it
 gives the same `bboxes` and `elements`, and MOSS-Image Layout Prompt makes the
 same prompt from them.
 
@@ -162,9 +161,6 @@ The boxes drawn on a Create Bounding Boxes do not move over by themselves. To
 take them along, wire that node's `elements` into `bboxes` of Layout Boxes and
 run once: they fill the canvas. Then remove the old node.
 
-The saved editor values differ. Layout Boxes uses its own `layout` text;
-it does not take Create Bounding Boxes' `editor_state` or `last_incoming`.
-
 ## Technical details
 
 - The boxes are kept on the node as text, in the hidden `layout` input. Each

js/docs/AUSBOSS_NODES_LoadAudio.md

@@ -0,0 +1,52 @@
+# Load Audio
+
+Loads a sound file and hands on only the part you pick. Use it for a voice
+clip, a song or any sound a video model or a save node takes, when you want
+one part of the file and not the whole thing.
+
+The node shows the whole file as a wave, so you can see where the loud parts
+are. The part that comes out is bright. Drag the white **IN** and **OUT**
+handles to set where it starts and stops, drag the bright part to slide it,
+or click somewhere else on the wave to move it there. You can also type a time
+under the wave, in seconds (`12.5`) or minutes and seconds (`1:02.5`).
+
+Press **▶** to hear only the part that comes out. **LOOP** plays it again and
+again.
+
+## Max length
+
+Set **Max length** to the longest sound the next step can take, such as the
+length of the video you are making. The start stays where it is, and anything
+past the limit turns red with a dashed line where it is cut. Next to OUT,
+the node shows how long the sound that comes out is, such as `15.0 s`. It
+turns red when part of your pick is cut; hold the mouse over it to see how
+much, and click it to move OUT to the cut. Play stops at the cut, so what you
+hear is what comes out. `0` means no limit.
+
+Max length can be wired. When the wire comes from a number node such as
+Float 🆎, the wave shows the cut for that number; otherwise the length's tooltip says
+`max wired` and the run still cuts the sound to the wired length.
+
+## Controls
+
+- **Source** (`audio`): a sound file in ComfyUI's input folder. **Upload**
+  adds one. Videos are listed as well, for their sound.
+- **Max length** (`max_seconds`): the longest the sound may be, in seconds.
+  `0` means no limit.
+- **IN** (`start_seconds`): where the sound starts.
+- **OUT** (`end_seconds`): where the sound stops. `0` means the end of the
+  file.
+
+## Outputs
+
+- `audio`: the part you picked, for any node that takes `AUDIO`.
+- `seconds`: how long that sound is.
+
+## Technical details
+
+- Only the picked part is decoded: decoding stops once the window is full,
+  so a short pick from a long recording stays quick.
+- The sound keeps its own sample rate and channels.
+- A start past the end of the file stops the run with a message that says so.
+- The wave is drawn in the browser from the file itself; nothing extra is
+  stored with the workflow besides the four values above.

js/docs/AUSBOSS_NODES_LoadImagePad.md

@@ -26,9 +26,9 @@ padding value unchanged.
 - **Reset padding** appears in the top-right corner while there is padding
   to clear; it sets every side a link does not drive back to 0.
 - Clicks on empty canvas space fall through, so the node still drags.
-- The hidden `pad_left`, `pad_top`, `pad_right` and `pad_bottom` widgets
-  hold the real values. The canvas sets them, so undo, save/load and the API
-  format all see plain INT widgets.
+- The hidden `pad_left/top/right/bottom` widgets hold the real values — the
+  canvas is their remote control, so undo, save/load, and the API format all
+  see plain INT widgets.
 
 ## Guarantees
 
@@ -41,8 +41,6 @@ padding value unchanged.
 
 ## Controls
 
-- **Exact padding** (`pad_left`, `pad_top`, `pad_right`, `pad_bottom`):
-  Pixels to add on each side. Each starts at `0` and accepts `0` to `16384`.
 - **Source** (`image`): Choose or upload from ComfyUI's input folder; the list previews the image under the pointer and filters as you type. A picture ComfyUI made, named like `photo.png [output]`, loads too, as it does in core Load Image.
 - **source_image** (optional socket): Wire an image from another node here
   and it is padded instead of the file; the Source row dims while the wire
@@ -52,8 +50,7 @@ padding value unchanged.
   loader that feeds one image per run pads a whole folder the same way.
 - **Fill** / **Color** / **Backdrop** (`mode` / `fill_color` /
   `backdrop_blur`): Five fills — `color`, `edge`, `edge pixel`,
-  `pillarbox blur`, `mirror`. The defaults are `color`, `#808080` and
-  blur `0.5`. **Color** shows for `color`, **Backdrop** for
+  `pillarbox blur`, `mirror`. **Color** shows for `color`, **Backdrop** for
   `pillarbox blur`. `mirror` reflects the picture outward at every edge (the
   edge pixel included, and on past the picture's own size), so the padding
   reads as more of the scene: the margin to give an edit model room to

js/docs/AUSBOSS_NODES_LoraLoader.md

@@ -35,7 +35,6 @@ all. **Remove this LoRA** is red. **Delete all LoRAs…** is a separate red, tra
 with confirmation; it clears this node's rows and keeps all files on disk.
 Cancel or Escape keeps the stack. Inserting keeps the existing rows and their settings in order;
 the new slot uses the gear menu's default strength (initially 1).
-The stack holds up to 64 rows.
 One strength drives both
 model and CLIP by default; the gear menu's **Separate model / CLIP
 strength** switch shows a second box per row. The switch is per-node — new
@@ -189,9 +188,7 @@ their order, strengths and switches. The same filename in different folders
 counts as separate LoRAs.
 
 The choice is one undo step. Closing the picker without choosing changes
-nothing. If a folder would take the stack past 64 rows, nothing is added
-and a message says how much room is needed. Remove rows or pick a smaller
-folder. Typing a filename and pressing Enter picks one file; use the arrow
+nothing. Typing a filename and pressing Enter picks one file; use the arrow
 keys to highlight a folder before Enter if you want the whole folder.
 Pointing at a folder with the mouse does not choose it for Enter.
 Left and Right collapse and expand a highlighted folder.
@@ -256,7 +253,7 @@ Details that keep the absorb faithful:
   rows from a loader without a connected CLIP import with CLIP strength 0
 - connected auxiliary outputs, such as trigger words, block absorption because
   bypassing their source would break those connections
-- linked LoRA settings and stacks beyond the row limit leave the sources active
+- linked LoRA settings leave the sources active
 - already-bypassed or muted loaders contribute no rows
 - a toast summarizes what was imported, bypassed, remapped, and skipped
 
@@ -272,8 +269,10 @@ data.
 The run side matches: a stale saved path resolves by name at load time
 (exact → unique case-insensitive path → unique basename, with a one-line
 console note when it remaps). A LoRA that is genuinely missing **stops the
-run before anything is sampled**, and the error names the file. The error
-also says where the switch is.
+run before anything is sampled**, and the error names the file — a picture
+that rendered without its LoRA is worse than no picture, above all for a
+script or an agent that would happily judge it. The error also says where
+the switch is.
 
 Gear menu → **Stop on missing LoRA** (on by default) turns that off for this
 node, and for LoRA Loaders you add later in this browser; nodes already saved
@@ -343,8 +342,8 @@ switched on for the old one.
 - **Default strength** (starts at 1): the strength a newly added LoRA gets.
 - **Strength step** (starts at 0.05): how far one drag step or arrow click
   moves a strength. Shift always steps by 0.01.
-- **Trigger word separator** (`trigger_separator`): what joins the
-  `triggers` output. It starts as a comma and a space.
+- **Trigger word separator** (a comma and a space to start): what joins the
+  `triggers` output.
 - **Hide file extension** and **Hide folder names** (both on): how names
   show on rows. The full path stays in the tooltip.
 
@@ -354,18 +353,9 @@ switched on for the old one.
 - **clip**: The CLIP with every enabled LoRA applied (empty when no CLIP
   is connected).
 - **triggers**: The selected trigger words from enabled rows, deduplicated,
-  joined with the gear menu's separator (a comma and a space by default).
+  joined with the gear menu's separator (a comma by default).
 
 Rows with a strength of `0` (both model and CLIP) are skipped at load time
 but still contribute their trigger words, so you can park a LoRA at zero
 while comparing. A row skipped because its file is missing contributes none:
 that LoRA is not in the picture.
-
-## API inputs
-
-- **model**: the model to patch.
-- **loras**: the stack as JSON text, empty (`[]`) by default. Each row can
-  hold `name`, `enabled`, `strength`, `strength_clip` and `triggers`.
-- **clip** (optional): the text encoder to patch. Without it, CLIP strengths
-  are ignored and the `clip` output is empty.
-- **trigger_separator** and **on_missing**: the settings described above.

js/docs/AUSBOSS_NODES_MaskByTouch.md

@@ -120,6 +120,8 @@ or an area you painted.
 
 ## The tools on the node
 
+- **Reload** (the round arrow) shows the picture coming in now: see
+  **Which picture the picks belong to**, below.
 - **Undo** takes back the last change, or a Clear. Ctrl+Z works as well: it
   is ComfyUI's own undo, and every change counts.
 - **Clear** picks nothing.
@@ -152,11 +154,15 @@ or an area you painted.
 - **More → Smooth** (`smooth`): rounds off a ragged outline by this many
   pixels.
 - **More → Fill small holes** (`fill_holes`): closes pinholes inside the
-  picked area. Larger openings stay open, like a mug's handle.
+  picked area. Larger openings stay open, like a mug's handle. Off by
+  default, so a hole you pick stays a hole.
 - **More → Invert** (`invert`): turns the mask round. On, the mask is
   everything except what you picked.
 - **More → If nothing** (`if_nothing`): **stop the run** or **empty mask**,
   see below.
+- **More → New picture** (`new_picture`): **keep picks** or **start over**,
+  for when a different picture comes in. See "Which picture the picks belong
+  to" below.
 - **More → Free VRAM** (`free_vram`): takes SAM 3 out of the graphics card's
   memory right after the search, so the next model has the room. Turn it on
   in a workflow that loads a big model after this node.
@@ -206,10 +212,21 @@ nothing instead.
 
 ## Which picture the picks belong to
 
-Picks belong to the picture they were made on. Load another picture and the
-node shows it with nothing picked, and says the old picks are not used.
-If the workflow runs before the node has shown the new picture, the run
-stops and says the picks were made on another picture.
+Picks belong to the picture they were made on. When a different picture
+comes in, **New picture** (under More) decides what happens to them:
+
+- **Keep picks** (the default): your clicks and paint move onto the new
+  picture, in the same places. On a picture of another size they are
+  scaled to fit it. A click finds whatever is at that spot now; paint stays
+  exactly as painted. Press **Clear** to start over.
+- **Start over**: the node shows the new picture with nothing picked. If the
+  workflow runs before you pick again, the run stops and says the picks
+  were made on another picture. The new picture shows on the node then,
+  ready to pick from.
+
+- **The reload button** (the round arrow beside Undo) shows the picture
+  coming in now. Use it after you change the picture before this node, for
+  example with an edit. It runs only this node and what comes before it.
 
 - With a Load Image wired straight in, or through Reroute nodes, the
   picture shows as soon as you choose a file.
@@ -316,7 +333,10 @@ no browser:
   used.
 - **`paint`**: exactly the stroke's own area. SAM 3 is not asked.
 - **`key`** names the picture the picks were made on: its size and a
-  fingerprint of every pixel. Picks made on another picture are ignored.
+  fingerprint of every pixel. Picks made on another picture are moved onto
+  the one that came in, scaled from the size in their key to its size, and
+  the face is sent the moved touches. With `new_picture` set to `start
+  over` they are ignored instead.
   Leave `key` out when you write `touches` by hand.
 
 ### How an area is tidied

js/docs/AUSBOSS_NODES_RealignToSource.md

@@ -31,35 +31,33 @@ names from here on; how it measures may still improve.
   moved a boat keeps the boat where it drew it, so the result lines up
   closely, not pixel for pixel.
 - **Leaves alone:** a picture it can't measure, or a zoom bigger than
-  **Max zoom**. That picture only comes out resized, and the report says
-  why.
+  **Max zoom** after allowing for padded reframing. That picture only
+  comes out resized, and the report says why.
 
 ## Controls
 
 - **edited**: the edited picture.
 - **source**: the original picture you edited, at the size the edit model
   saw it (in the Qwen Image 2.1 Edit + Realign example, the Image Resize
-  output). The result comes out at this size. If you wire the padded canvas
-  itself here with its stitcher, the result is just the source rectangle,
-  without the padding. For a batch or a video, give
+  output). The result comes out at this size. For a batch or a video, give
   one source picture, or one per edited frame.
 - **stitcher** (optional): from Load Image + Pad 🆎 when you padded the
   picture before editing. Image Crop + Rotate + Pad 🆎 works too. A Crop
   For Inpaint 🆎 stitcher does not work here.
-- **Fit** (`fit`): `zoom + shift` (the default) fixes the usual Qwen drift.
+- **Fit**: `zoom + shift` (the default) fixes the usual Qwen drift.
   `affine` also fixes a slight tilt.
-- **Empty fill** (`empty_fill`): when the edit slid past the edge, a thin
-  strip ends up with nothing in it. `edge` (the default) stretches the nearest pixels
+- **Empty fill**: when the edit slid past the edge, a thin strip ends up
+  with nothing in it. `edge` (the default) stretches the nearest pixels
   into it, `source` fills it from the original, `gray` fills it flat gray
   for inpainting. With a big enough margin there is no strip.
-- **Max zoom** (`max_zoom`): the biggest zoom it will undo, in percent
-  (`1` to `50`, `20` by default).
-  Anything bigger is treated as a change you meant and left alone.
+- **Max zoom**: the zoom limit in percent (20 by default). For a padded
+  picture, zooming in to fill the padding gets an extra allowance; the
+  setting limits zoom beyond that. Zooming out still uses the stated limit.
+  Anything beyond those limits is treated as a change you meant and left alone.
 
 ## Outputs
 
-- **image**: the edit, lined up with the original and at its size, or just
-  the source rectangle when a padded canvas and its stitcher are wired in.
+- **image**: the edit, lined up with the original and at its size.
 - **empty_mask**: white where the lined-up edit has nothing (a strip that
   slid off the edge), black everywhere else. Crop the strip off or inpaint
   it.
@@ -125,6 +123,10 @@ new cloud, are left out. It trusts the fit when at least 10 blocks, and at
 least a quarter of them, agree. With a stitcher, the blocks tile the
 picture's area only.
 
+For padded reframing, the extra zoom-in allowance on each axis is the
+canvas size divided by the source picture's size, minus one. It is added
+to **Max zoom**; zooming out gets no extra allowance.
+
 It runs on the CPU in a fraction of a second per 1 MP frame. No new
 dependencies, and no model.
 

js/docs/AUSBOSS_NODES_Resolution.md

@@ -8,6 +8,14 @@ Pick a picture size by shape and megapixels, or by dragging. Use it in place of
 - **Gear:** set the **Snap step**, edit the **Ratio rail**, choose the **Latent family** (`latent`) and **Batch size** (`batch_size`), and hide the **Dot grid** or **MP cost curves**. **Snap step** (8, 16, 32 or 64; starts at 32) is the grid that drags, arrow keys and chips land on. The **Ratio rail** is the list of ratio chips, typed as `1:1, 21:9`. The display options apply to every Latent Size node in this browser; latent family and batch size (1 to 64) belong to this node.
 - **Node size:** drag the node's corner to make it wider or taller, so it lines up with the nodes around it. The controls stretch with it, and the canvas preview takes any extra height. It can be as narrow as 320 pixels.
 
+## Workflow resolutions
+
+In the gear, choose **This workflow → Workflow resolutions → Edit list**. Enter one exact width × height per line, up to 24. The list belongs to this node and travels with the saved workflow. An empty list leaves the normal editor unchanged.
+
+- **Recommendations:** leave **Limit choices to this list** off. The Sizes row shows your quick picks, and users can still type, drag or choose another shape.
+- **Strict model sizes:** turn the limit on. The Shape row shows only the exact ratios in the list. Select a ratio to see its allowed sizes. For example, 576×1024 and 720×1280 share 9:16; 480×864 is a separate 5:9 option. Landscape is available only if you list a landscape size. The canvas stays visible, but it cannot be stretched. The swap button works only if the exact reverse size is listed.
+- On enabling the limit, an unlinked size stays selected if allowed; otherwise the first listed size is selected. A linked width or height is checked at run time, before the latent is allocated. An unsupported pair produces an error naming the allowed sizes. For video workflows, connect these width and height outputs to the video latent node.
+
 ## Outputs and links
 
 Outputs are **width**, **height**, and **latent**, in that order. The node has four input sockets above the panel: width, height, latent and batch_size. Linking width or height locks the controls that would change both dimensions; the other dimension remains editable. Linking latent or batch_size sets the latent family or batch size from another node, and the gear then shows that setting as linked. A linked value is read when the workflow runs, so the preview keeps showing the size stored on the node.

js/docs/AUSBOSS_NODES_SaveImage.md

@@ -41,9 +41,9 @@ file's name. A caption on the `caption_text` input writes the paired `.txt`.
   workflow in EXIF. **JXL** (`jxl lossless`, lossless JPEG XL) is the most
   compact; it needs the optional `pillow-jxl-plugin` in ComfyUI's python
   (also the pack's `jxl` extra) and few browsers preview it.
-- **Embed workflow** (`save_metadata`): **yes** stores the prompt and
+- **Embed workflow** (`save_metadata`): **On** stores the prompt and
   workflow in the file (PNG text chunks, EXIF in webp and jxl) so it drags
-  back into ComfyUI; **no** writes a clean file for sharing or datasets.
+  back into ComfyUI; **Off** writes a clean file for sharing or datasets.
   `--disable-metadata` on the server wins.
 - **Preview** (`preview`): the small switch under the card shows the saved
   image on the node. Off, the picture's box goes away and the node is
@@ -52,7 +52,7 @@ file's name. A caption on the `caption_text` input writes the paired `.txt`.
   still lists it. When a run saves more than one image (a batch, or a list
   such as a folder of images), arrows beside the switch (‹ 2 / 5 ›) step
   through them.
-- **Steps** (`step_preview`, off by default): the switch left of
+- **Preview steps** (`step_preview`, off by default): the switch left of
   **preview** shows the picture while it is being made, one step at a time,
   where the saved image goes, with a **STOP** button on the bar. Stop a run
   that is going wrong after the first steps instead of waiting for the end;
@@ -65,23 +65,21 @@ file's name. A caption on the `caption_text` input writes the paired `.txt`.
 
 ## Inputs
 
-- **images** (IMAGE): the batch to save. Each image becomes a separate file.
 - **filename** (STRING, link only): the exact name from upstream - a Load
   Image name, a caption tool's id. Its image extension is swapped for the
   chosen format's (`photo123.jpg` -> `photo123.png`); a batch appends
   `_001`, `_002`... A linked but empty value stops the run instead of saving
   under a made-up name.
 - **caption_text** (STRING, link only): saved as a UTF-8 `.txt` beside every
-  image with the same name (`portrait.png` -> `portrait.txt`). A non-blank
-  linked caption wins. If it is blank or unwired, the old `caption` box is
-  used instead. No sidecar is written when both are blank.
+  image with the same name (`portrait.png` -> `portrait.txt`). Empty writes
+  no sidecar. The old `caption` box still works underneath; a linked caption
+  wins.
 
 Rooted paths and `..` in names typed on the node are rejected before the
 run. A bad name arriving through the `filename` link stops the run at this
 node, before any file is written. `on_existing`
 from older workflows is still honored wherever a save can land on an
-existing file (counter off, exact or linked names). Its choices are
-`overwrite` (the default), `skip` and `error`.
+existing file (counter off, exact or linked names).
 
 ## Name tokens
 

js/docs/AUSBOSS_NODES_SaveVideo.md

@@ -9,9 +9,9 @@ duration, shows a tall video whole, and has a **LOOP** control. `gif` and
 `webp` are shown as pictures with just the file name, since a video player
 cannot play either.
 
-**STEPS** (`step_preview`, off by default) shows the clip's first frame in
+**Preview steps** above the player (`step_preview`, off by default) shows the clip's first frame in
 the player while it is being made, one step at a time, with a **STOP**
-button beside it. Stop a clip that is going wrong after the first steps
+button on the player. Stop a clip that is going wrong after the first steps
 instead of waiting for the end; a stopped run saves nothing. The saved
 video replaces the steps. The [Step Preview](AUSBOSS_NODES_StepPreview.md)
 page has the details.
@@ -37,7 +37,7 @@ page has the details.
 - **Ping-pong** (`pingpong`): Plays the clip forward then backward so it loops seamlessly.
   Roughly doubles the frame count and the encode time. The first and last
   frames are not repeated at the turnaround, so the loop does not hitch.
-- **Metadata** (`save_metadata`): On by default. Turn it off to share a file
+- **Embed workflow** (`save_metadata`): On by default. Turn it off to share a file
   without your prompt and node graph embedded in it. If ComfyUI was started
   with `--disable-metadata`, nothing is embedded whatever this says.
 - **audio** (optional): A track to mux into the file, e.g. Load Video's
@@ -83,7 +83,7 @@ metadata, so an embedded workflow is not available for them.
 The node's face follows the table: widgets the chosen format ignores are
 hidden rather than left to look meaningful. The CRF field leaves the
 **FPS · CRF** row for `mov prores`, `mkv ffv1` and `gif` (their rows read
-*ignored* above), and the **Metadata** row disappears for `gif` and `webp`,
+*ignored* above), and the **Embed workflow** row disappears for `gif` and `webp`,
 which cannot carry it. Hidden is not removed:
 the widget keeps its position and its value, saved workflows store and restore
 it exactly as before, and switching the format back brings it back with the

js/docs/AUSBOSS_NODES_Seed.md

@@ -27,6 +27,15 @@ needs.
 - The line underneath shows the last run's seed. The history saves with the
   workflow.
 
+## Compact look
+
+The **gear** beside the number picks the look. **Compact** is one short
+row: the number, a mode chip and a dice. Tap the chip to go Random → Fixed →
++1 → −1. The dice rolls a new seed and pins it. A long seed shrinks to fit.
+Hover the number to see the last run's seed. The look is saved on the node,
+and new Seed nodes start in the look you picked last. **Full** brings back
+the whole card, with the seeds it ran with.
+
 ## Output
 
 - **seed**: The seed, unchanged.

js/docs/AUSBOSS_NODES_SelectEveryNth.md

@@ -18,10 +18,8 @@ before an expensive stage, or thin a long sweep down to samples.
 ## Outputs
 
 - **images**: The kept frames, in their original order.
-- **fps**: The wired rate divided by `nth`, to keep playback speed;
-  `0` when no fps is wired. Offset removes the start, and rounding to whole
-  frames can change the duration. Five frames thinned by `2` give three
-  frames at half the rate, which lasts slightly longer.
+- **fps**: The wired rate divided by `nth`, so the kept frames still span
+  the same time; `0` when no fps is wired.
 
 An offset at or past the end of the batch stops with the batch's size
 instead of returning an empty batch, which no downstream node could use.

js/docs/AUSBOSS_NODES_StitchInpaint.md

@@ -67,9 +67,11 @@ are in the model's own picture.
   Tone match 0 the new area is bit-identical to what the model painted, and
   the whole stitch is the 2.4.0 blend in, pixel for pixel.
 - With the classic seam, feeding the crop back unchanged reproduces the
-  original image exactly (with `fix_edge_halo` off; the fix rewrites the
-  feathered band on purpose). Blend in does not promise this: it keeps the
-  model's version of the thin strip at your picture's edge.
+  original image exactly only when there is no resizing in either direction,
+  with Tone match at 0 and `fix_edge_halo` off. Resizing can lose detail even
+  when the crop comes back unchanged; the halo fix rewrites the feathered
+  band on purpose. Blend in does not promise this: it keeps the model's
+  version of the thin strip at your picture's edge.
 - A stitcher built from one image broadcasts over any number of inpainted
   frames. A stitcher built from **more** frames than came back is trimmed to
   the leading ones with a console note - video models keep 8n+1 (LTX) or

js/docs/AUSBOSS_NODES_TiledUpscale.md

@@ -8,17 +8,11 @@ Wire it like this: **Tiled Upscale 🆎** → your encode, sampler and decode
 → **Tiled Upscale Stitch 🆎**. Plug `stitcher` straight across. The nodes
 in between run once for each tile by themselves.
 
-## Input
-
-- **image**: The picture or batch to cut into tiles. Every picture in a batch
-  uses the same tile positions.
-
 ## Megapixels
 
-**Megapixels** (`megapixels`) is the size of the finished picture. It starts
-at `4` and accepts `0` to `64`. It moves in half steps, and you can type a
-value between those limits. `0` keeps the picture's own size, for a light
-pass over a picture that is already big.
+**Megapixels** (`megapixels`) is the size of the finished picture. It moves
+in half steps, and you can type any number. `0` keeps the picture's own
+size, for a light pass over a picture that is already big.
 
 - A picture that fits in one tile stays whole: one pass, no joins.
 - A bigger one is cut into the fewest tiles that fit, as square as they

js/docs/AUSBOSS_NODES_TiledUpscaleStitch.md

@@ -28,11 +28,6 @@ picture before the tiles are joined.
 Grain and color noise in an old photo do not throw it off, and a faded
 photo comes back faded.
 
-## Output
-
-- **image**: The finished RGB picture at the requested size. The output is
-  a list, with one batch for each stitcher supplied.
-
 ## Technical details
 
 - Neighbouring tiles are blended across the strip they share, fading from

js/docs/AUSBOSS_NODES_VideoCropRotatePad.md

@@ -11,65 +11,42 @@ generated-area `mask`, a `stitcher` for Stitch Inpaint, the selected
 
 ## Source and frame
 
-- **Uploads**: Pick an input video (the list plays the clip under the pointer, muted, and filters as you type), click **Upload** in the compact source card, or
+- **Inputs**: Pick an input video (the list plays the clip under the pointer, muted, and filters as you type), click **Load** in the compact source card, or
   drop a video file onto the node. Picking another video keeps Fill, Feather,
-  **Divisible by**, the Resize settings and the lit ratio button (the new frame is
+  **Align**, the Resize settings and the lit ratio button (the new frame is
   fitted to it the way **Fit** is set); rotation, crop, padding and the playhead
   start over.
-- **Canvas row** under the Fit row: fill swatch, feather amount and the Resize off | on switch on the node face; turning Resize on opens the megapixel budget and its Step. The line under the picture names each step that sets the output size, as on the image node.
-- **Upload** streams to the input folder, so videos larger than the buffered image-upload limit can be selected here or dropped onto the node.
-- **Uploads** / **Outputs** (`source_mode`: `input folder` / `local path`): the source card's switch. Uploads lists ComfyUI's input folder. Outputs lists the videos in ComfyUI's output folder, newest first, so a video you just rendered can be picked without uploading it again. Both lists preview the video under the pointer.
+- **Load** streams to the input folder, so videos larger than the buffered image-upload limit can be selected here or dropped onto the node.
+- **Inputs** / **Outputs** (`source_mode`: `input folder` / `local path`): the source card's switch. Inputs lists ComfyUI's input folder. Outputs lists the videos in ComfyUI's output folder, newest first, so a video you just rendered can be picked without uploading it again. Both lists preview the video under the pointer.
 - **local_path**: The video picked in the Outputs list, named the way ComfyUI names a file
   in its output folder: `clip.mp4 [output]`, `video/take 3.mov [output]`. It is read in
   place, without an upload copy. A whole path such as `/home/me/ComfyUI/output/clip.mp4`
   is not read, for queued runs and the editor's live preview alike.
-- **Playhead**: The rail under the node's preview is the timeline: press or drag it to
+- **Play / Pause** beside the scrubber previews the video. Pause on the frame you want to output.
+- **Playhead**: The rail directly under the node's preview is the timeline: press or drag it to
   scrub, or type a frame in the **FRAME** box; the frame on the stage is the frame the
   node outputs (`frame_index`, with `frame_time` kept in step).
+- **Crop, pad & resize** (collapsible group under the timeline): folds the ratio buttons, **Fit to ratio**, **Align** and **Center**, **Fill** and **Feather**, and the **Resize** off | on switch, megapixel budget and **Step** into one drawer, showing the fill swatch and a live summary on its header when closed. The line under the picture names each step that sets the output size, as on the image node.
 - **seek_mode / frame_time**: Time-based seeking for graphs that drive the position by
   link; the editor itself always works in frames.
 
 The editor has the same rail full width, plus first/last, ±1, ±25, ±50, ±100, play/pause, keyboard arrows (one frame, 10 with Shift), Home/End and Space to play or pause. **Save & close** keeps your edits; **Cancel** or Escape puts everything back, and asks first if anything changed. Only one frame preview request remains active; stale requests are cancelled, and frames already shown are served from a small cache.
 
-## Transform values
-
-The handles and editor write these inputs. An API prompt can set them too.
-
-| Input | Default | What it sets |
-| --- | --- | --- |
-| `rotation_degrees` | `0` | Clockwise turn, from `-180` to `180` degrees. |
-| `crop_aspect_ratio` | `free` | Crop shape: `free`, `source`, or a width:height ratio. |
-| `crop_x`, `crop_y` | `0` | Crop's left and top, in pixels of the turned picture; `0` to `65536`. |
-| `crop_width`, `crop_height` | `0` | Crop size, `0` to `65536`; `0` keeps the available size from that position. |
-| `pad_left`, `pad_top`, `pad_right`, `pad_bottom` | `0` | Added pixels on each side, `0` to `32768`. |
-| `feather` | `24` | Mask feather in pixels, `0` to `4096`. The picture meets the fill at a hard edge. |
-| `canvas_multiple` | `1` | Size multiple, `1` to `4096`; `1` turns rounding off. |
-| `fill_color` | `#808080` | Fill for padding and empty corners. |
-| `resize_to_megapixels` | `false` | Turn the output resize on. |
-| `megapixels` | `1` | Resize budget, `0.01` to `16`; one megapixel here is 1024 × 1024 pixels. |
-| `resize_method` | `lanczos` | Resize filter: `lanczos`, `area`, `bicubic`, `bilinear`, `nearest-exact`. |
-| `resolution_steps` | `1` | Round resized sides to this multiple, `1` to `256`. |
-
-The built-in crop ratios are `1:1`, `9:16`, `16:9`, `2:3`, `3:2`,
-`3:4`, `4:3`, `9:21` and `21:9`. Other positive whole-number ratios
-are accepted too. The resize runs after the transform; its step can change
-a size that already met `canvas_multiple`.
-
 ## Transform and outputs
 
-Rotation, crop, padding, feathering, fill, **Divisible by**, the megapixel resize, gestures, `image`, and `mask` match the image node. The output batch contains one frame.
+Rotation, crop, padding, feathering, fill, **Align**, the megapixel resize, gestures, `image`, and `mask` match the image node. The output batch contains one frame.
 
 The handles work on both the node and the editor. Drag an orange corner to make
 the canvas bigger or smaller in its own shape (hold **Alt**, Option on a Mac, to
 change all four sides at once), and press **Center** next to Fill and Feather to
-put the frame in the middle, side to side or top to bottom. Both work as on the
+center the crop and balance any padding, side to side or top to bottom. Both work as on the
 image node. The ratio buttons, **Fit**,
 the padlock and the orientation button work as on the image node: a tap pads (or,
 with Fit on crop, crops) the frame to a ratio, a lit ratio is the shape the canvas
 has now, and the padlock keeps that shape while you drag (the row says **Held**).
 **Reset crop** restores the full crop while keeping rotation and padding. **Reset**
 clears rotation, crop and padding and turns the padlock off; fill, feather,
-**Divisible by** and the playhead stay. **Divisible by** makes the width and
+**Align** and the playhead stay. **Align** makes the width and
 height divide evenly by the number you pick: padding grows by a few pixels, and
 a side with no padding is trimmed by a few instead. Some models need sizes
 divisible by 8, 16 or 32; 1 turns it off.

js/docs/AUSBOSS_NODES_VideoCropRotatePadClip.md

@@ -11,33 +11,20 @@ model that paints black regions.
 
 ## Source and window
 
-- **Uploads**: Pick an existing input video (the list plays the clip under the pointer, muted, and filters as you type), click **Upload**, or drop a video file
+- **Inputs**: Pick an existing input video (the list plays the clip under the pointer, muted, and filters as you type), click **Load**, or drop a video file
   onto the node. The old source widgets remain compatible with saved workflows, but
   are now driven by this compact card. Choosing another video keeps the canvas
-  settings - Fill, Feather, **Divisible by**, Resize, Every nth, Frames for, Length - and
+  settings - Fill, Feather, **Align**, Resize, Every nth, Frames for, Length - and
   fits the new clip to the lit ratio button, the way **Fit** is set. Rotation, crop,
   padding, IN/OUT and the playhead start over.
-- **Canvas row** (under the Fit row): the fill swatch, the feather amount and
-  the Resize off | on switch, right on the node; turning Resize on opens the megapixel
-  budget and its **Step**. These are what a video outpaint model keys on - the LTX IC-LoRA paints
-  **pure black** at sizes rounded to 32 - so a wrong value shows here before a
-  render is wasted. Feather only softens the mask and the stitch; the frames always
-  meet the fill with a hard edge. The line under the picture names each step that
-  sets the size (`576×1024 → pad 1821×1024 → resize 1280×704`) and warns in amber
-  when the Step stretches the picture by more than 1% (`2.2% wider: each side rounds
-  to 32 px`); the tooltip names a Step that avoids it, and in pad mode **Even out**
-  adds a few pixels of padding so nothing stretches. While you drag, that amber
-  line keeps still and comes back for the new size when you let go. The bands are drawn in the real
-  fill colour with a faint hatch, so black bands show on the black stage. A fresh clip node starts
-  with black and feather 0 and the editor's **Reset transform** returns to them;
-  the image nodes keep their grey fill and feathered mask.
 - **Outputs** (`source_mode` / `local_path`): Pick a video from ComfyUI's output folder,
   such as one you just rendered. The list shows the newest first and previews the video
   under the pointer. The video is read in place, without an upload copy. In an API prompt
   it is named the way ComfyUI names a file there: `clip.mp4 [output]`. A whole path such
   as `/home/me/ComfyUI/output/clip.mp4` is not read, for queued runs and the editor's live
   preview alike.
-- **Timeline**: The rail on the node and in the editor is one timeline. Press or
+- **Play / Pause** beside the scrubber previews the selected frames and stops at OUT. Press Play at OUT to start from IN again.
+- **Timeline** (right under the preview and size line): The rail on the node and in the editor is one timeline. Press or
   drag anywhere on it to scrub the **playhead**, with Length on or off; the stage shows
   that frame. Drag the **IN** or **OUT** handle to trim: the playhead rides on the handle, so what you see
   is the first (IN) or last (OUT) frame the run keeps, and it stays there when you let
@@ -53,6 +40,21 @@ model that paints black regions.
   **Play**. Arrow keys step one frame (10 with Shift), Home and End jump to the
   ends, and Space plays or pauses. **Save & close** keeps your edits; **Cancel** or
   Escape puts everything back, and asks first if anything changed.
+- **Crop, pad & resize** (collapsible group under the timeline): folds the ratio
+  buttons, **Fit to ratio**, **Align** and **Center**, **Fill** and **Feather**, and
+  the **Resize** switch, megapixel budget and **Step** into one drawer. While closed,
+  its header bar shows the fill colour swatch and a live summary of the active
+  ratio, feather, alignment and resize settings. These are what a video outpaint model keys on - the LTX IC-LoRA paints
+  **pure black** at sizes rounded to 32 - so a wrong value shows here before a
+  render is wasted. Feather only softens the mask and the stitch; the frames always
+  meet the fill with a hard edge. The line under the picture names each step that
+  sets the size (`576×1024 → pad 1821×1024 → resize 1280×704`) and warns in amber
+  when the Step stretches the picture by more than 1% (`Resize makes the picture 2.2% wider`); the tooltip names a Step that avoids it, and in pad mode **Pad to keep shape**
+  adds a few pixels of padding so nothing stretches. While you drag, that amber
+  line keeps still and comes back for the new size when you let go. The bands are drawn in the real
+  fill colour with a faint hatch, so black bands show on the black stage. A fresh clip node starts
+  with black and feather 0 and the editor's **Reset transform** returns to them;
+  the image nodes keep their grey fill and feathered mask.
 - **Length** (`max_frames`): the one other way to set how long the clip is. **Off**
   (the default): OUT ends the clip. **On**: a number of output frames from IN; OUT
   sits that many frames after IN and follows it when you drag IN, and dragging OUT or
@@ -80,8 +82,8 @@ Crop squares, padding diamonds, the orange corners and the rotation handle also
 work directly on the node preview. A corner makes the canvas bigger or smaller in
 its own shape, for example to zoom out evenly before a video outpaint; hold **Alt**
 (Option on a Mac) to change all four sides at once. **Center**, next to Fill and
-Feather, puts the clip in the middle of the canvas side to side or top to bottom
-without changing the canvas size. The graph still owns wheel zoom and middle-button
+Feather, centers the crop on the source and balances any padding on the selected axis.
+The generated mask follows the crop and padding. The graph still owns wheel zoom and middle-button
 pan. Tap a ratio
 to pad the clip to it (or crop it, with **Fit** on crop); tap the lit ratio again to
 go back to the whole frame. A lit ratio is the shape the canvas has now: drag a
@@ -92,55 +94,31 @@ ratio or turn it"); otherwise it names the lit ratio where it acted (`pad to 16:
 1821×1024`). The padlock keeps the shape while
 you drag, with new bands split evenly, and the row says **Held**; Reset and tapping
 the lit ratio turn it off, and it does nothing on the untouched clip. **Fit** is
-dimmed until a ratio is lit. The orientation button turns the shape on its side
+ready to set before picking a ratio. The orientation button turns the shape on its side
 (16:9 to 9:16), and dragging the picture itself moves it inside its padding: the
 cursor and small arrows show which ways it can go.
 **Reset crop** restores the full crop without changing rotation, padding or trim;
 with the padlock on it also takes away the bands the lock added.
 **Reset** on the node clears rotation, crop and padding and turns the padlock off;
-fill, feather, **Divisible by** and the timeline stay.
+fill, feather, **Align** and the timeline stay.
 **Reset transform** in the editor resets rotation, crop, padding, fill, feather and
-**Divisible by**; it keeps the source, current frame, trim, Length, resize and stitch
-settings. **Divisible by** makes the width and height divide evenly by the number
+**Align**; it keeps the source, current frame, trim, Length, resize and stitch
+settings. **Align** makes the width and height divide evenly by the number
 you pick: padding grows by a few pixels, and a side with no padding is trimmed by
 a few instead. Some models need sizes divisible by 8, 16 or 32; 1 turns it off.
 
-Video Upload and file drop use a streaming route into ComfyUI's input folder,
+The **Load** button and file drop use a streaming route into ComfyUI's input folder,
 so the buffered image-upload size limit does not prevent long-video uploads.
 
 The editor's sidebar uses the node's own ratio row, padlock and **Fit** switch, and
 the rotation is a number box (Shift for 0.1°). A ratio replaces the old crop and
 padding, keeping rotation and resize settings.
-Pixel rounding can differ by one pixel between opposite bands. **Divisible by** and
+Pixel rounding can differ by one pixel between opposite bands. **Align** and
 the resize **Step** can slightly change the final aspect ratio.
 
-## Transform values
-
-The handles and editor write these inputs. An API prompt can set them too.
-
-| Input | Default | What it sets |
-| --- | --- | --- |
-| `rotation_degrees` | `0` | Clockwise turn, from `-180` to `180` degrees. |
-| `crop_aspect_ratio` | `free` | Crop shape: `free`, `source`, or a width:height ratio. |
-| `crop_x`, `crop_y` | `0` | Crop's left and top, in pixels of the turned picture; `0` to `65536`. |
-| `crop_width`, `crop_height` | `0` | Crop size, `0` to `65536`; `0` keeps the available size from that position. |
-| `pad_left`, `pad_top`, `pad_right`, `pad_bottom` | `0` | Added pixels on each side, `0` to `32768`. |
-| `feather` | `0` | Mask feather in pixels, `0` to `4096`. The picture meets the fill at a hard edge. |
-| `canvas_multiple` | `1` | Size multiple, `1` to `4096`; `1` turns rounding off. |
-| `fill_color` | `#000000` | Fill for padding and empty corners. |
-| `resize_to_megapixels` | `false` | Turn the output resize on. |
-| `megapixels` | `1` | Resize budget, `0.01` to `16`; one megapixel here is 1024 × 1024 pixels. |
-| `resize_method` | `lanczos` | Resize filter: `lanczos`, `area`, `bicubic`, `bilinear`, `nearest-exact`. |
-| `resolution_steps` | `1` | Round resized sides to this multiple, `1` to `256`. |
-
-The built-in crop ratios are `1:1`, `9:16`, `16:9`, `2:3`, `3:2`,
-`3:4`, `4:3`, `9:21` and `21:9`. Other positive whole-number ratios
-are accepted too. The resize runs after the transform; its step can change
-a size that already met `canvas_multiple`.
-
 ## Transform and outputs
 
-Rotation, crop, padding, feathering, fill, **Divisible by**, and the editor's handles
+Rotation, crop, padding, feathering, fill, **Align**, and the editor's handles
 match the image node. **Resize output** in the editor scales the finished frames to a
 megapixel budget with a resolution step (32 keeps LTX and Wan sizes), the same trio as
 the core Scale Image to Total Pixels node. The frames are resized by themselves and the
@@ -177,25 +155,16 @@ The node performs no remote network requests and does not rewrite the source vid
 
 ## Connected timing inputs
 
-Six optional timing inputs can take links above the editor:
+Five optional sockets sit on the left, above the editor:
 
 | Input | Meaning |
 | --- | --- |
-| `force_rate` | Sample at this fps before Every nth. 0 keeps the source rate; the allowed range is 0 to 1000 fps. Drops or repeats frames to keep playback speed. Accepts FLOAT or INT. |
+| `force_rate` | Sample at this fps before Every nth. 0 keeps the source rate. Drops or repeats frames to keep playback speed. Accepts FLOAT or INT. |
 | `start_frame` | Zero-based source start frame. Overrides timeline IN. |
 | `end_frame` | Exclusive source end frame. 0 means the end of the source. Overrides timeline OUT. |
-| `fixed_frames` | Exact output frames, 0 to 100000; 0 turns it off. A positive value overrides OUT/end_frame, Length, frame_load_cap and Frames for. The source must be long enough. Near the end, IN can move earlier so the window fits. |
-| `frame_load_cap` | Maximum frames after rate conversion and Every nth, before Frames for. 0 means unlimited. Connected, it sets the length in place of Length. |
-| `last_seconds` | Load only this many seconds from the end of the clip, or of the part before OUT, without moving before IN. 0 keeps the current window. Use it to carry on from a clip: a long clip then costs no more memory than a short one. |
-
-`seek_mode` (`frame index` by default, or `time seconds`), `frame_index`
-and `frame_time` set only the preview position. Both position values start
-at `0`; neither trims the output.
-
-Fresh timing settings are IN/OUT `0`, Every nth `1`, Length (`max_frames`)
-`0` and Frames for (`frame_snap`) `free`. Every nth accepts `1` to `512`;
-Length accepts `0` to `100000`. The API choices for Frames for are `free`,
-`8n+1` and `4n+1`; they round the kept count down.
+| `fixed_frames` | Exact output frames from IN; the source must be long enough. Connected, it sets the length: OUT, Length and Frames for step aside. |
+| `frame_load_cap` | Maximum frames after rate conversion and Every nth, before Frames for. 0 means unlimited. Connected, it sets the length in place of Length. When the count is known, dragging IN stops at the last start that fits the kept frames. |
+| `last_seconds` | Load only this many seconds from the end of the clip, or of the part before OUT. 0 loads all of it. Use it to carry on from a clip: a long clip then costs no more memory than a short one. |
 
 Frame bounds use the source's frame-rate grid, independent of `force_rate`.
 The footer labels **Source fps** separately from **Output fps**. A direct

js/docs/AUSBOSS_NODES_WorkflowNote.md

@@ -18,14 +18,37 @@ Nothing runs: the node has no outputs, so ComfyUI never executes it.
 - **Title / Subtitle / Author** make the banner. **Layout → Banner** shows
   only that top block (the title, plus the subtitle and author if you filled
   them in), so the same node doubles as a label for a stage or column.
+- **Layout → Info tile** puts a single button on the canvas. Click the tile to read the full note, including models and links. A book marks a guide and a download arrow marks a model list. Click its pencil to edit, or press **Edit** inside the opened note. Drag the visible bottom-right grip to resize the tile without moving it. Focus the grip and use arrow keys for keyboard resizing; **Shift** makes smaller changes.
 - **Accent color** tints the banner bar, dots and buttons; empty keeps the
   pack teal. It takes a six-digit hex such as `#00b4aa`.
 - **How-to** is Markdown-lite: `#`/`##`/`###` headings, `**bold**`,
   `*italic*`, `` `code` ``, `[links](https://…)`, `-` and `1.` lists, `---`
   rules, fenced code. Only `http(s)` links become clickable.
 
+## Formatting a how-to
+
+Select a phrase in the How-to field and click **Teal**, **Green**, **Amber** or **Glow**. Click **Table** to insert an editable Markdown table. Open **Preview formatting** while you write. Use headings to break up steps and a pipe table for settings or file locations. Keep each row the same length. Use `\|` for a literal pipe inside a cell.
+
+```markdown
+## Choose a size
+
+| Size | When to use it |
+| --- | --- |
+| 480 × 864 | [teal]First run[/teal] |
+| 576 × 1024 | A larger portrait |
+
+[green]Ready[/green] means the model was found.
+[amber]Missing[/amber] means you still need the file.
+```
+
+For a short highlight, write `[glow]Preview the result[/glow]`. The glow is static. These four tags are AusBoss additions to Markdown. They style the enclosed plain text. Headings, lists, table cells and paragraphs can all contain them. Fenced code displays the original characters.
+
 ## Models
 
+To give downloads their own button, choose **Layout → Info tile**, set the title to **Download models**, and add files under **Models**. To keep them with your instructions, add those same rows to the **How to use** note. Switching an existing card to an info tile keeps its model rows and links.
+
+[Download the Krea 2 model tile example](https://raw.githubusercontent.com/ausboss/ComfyUI-AusBoss/main/js/docs/examples/model-download-tile.json) and open it as a workflow. Copy the tile into your graph and edit its rows.
+
 Each row is a file, the model folder it belongs in, an optional size, a
 download URL, and an optional note that shows in grey under the file name.
 Rows group under a `📂 ComfyUI/models/<folder>` heading so the

js/docs/AUSBOSS_NODES_WorkflowNoteTile.md

@@ -0,0 +1,7 @@
+# Workflow Note Tile
+
+A compact help button that opens a full note. Click to read the instructions and model links; click the pencil to edit. Drag its visible corner to resize.
+
+It uses the same note content as [Workflow Note](AUSBOSS_NODES_WorkflowNote.md). Choose **Card** or **Banner** in the editor to show the note directly on the canvas. Nothing runs and it has no outputs.
+
+Tiles save with their own node type. If ComfyUI reports this node missing, install or update **ComfyUI-AusBoss**, restart ComfyUI, and reload the workflow. An older pack cannot draw the tile correctly. Keep the missing node so its instructions and settings are preserved.

js/docs/AUSBOSS_NODES_WorkflowSwitches.md

@@ -14,8 +14,8 @@ an upscale at the end.
 2. Press **+ Switch from 2 selected** on the card.
 3. Type a name and press Enter.
 
-One click on its pill now turns every node you picked off, and the next click
-turns them on again.
+Click **off** to skip every node you picked, or **on** to run them again.
+Clicking the selected half leaves it selected.
 
 Groups work too. Every group on the canvas gets a switch of its own, unless
 you change that under **Settings**. A group can also be part of a switch you
@@ -160,8 +160,9 @@ the models only that part needs.
 
 ## The edit view
 
-- **off | on**: click anywhere on the pill to flip the switch. Off turns off
-  every node of the row, on sets them all to run. It is one undo step.
+- **off | on**: click **off** to turn off every node of the row, or **on** to
+  set them all to run. Clicking the selected half leaves it selected. A change
+  is one undo step.
 - **Mixed**: when only some of a row's nodes run (one bypassed by hand, say)
   the pill is striped and a count shows how many run, such as **1/2**. Click
   the half you want, off or on, to set them all. A settings switch reads **changed** when one of

js/docs/SimpleWatermarkRemover.md

@@ -11,8 +11,4 @@ be there. For anything new, use
 [LaMa Inpaint 🆎](AUSBOSS_NODES_LaMaInpaint.md) instead: the same engine
 with the full set of controls and live previews.
 
-## Output
-
-- **image**: The inpainted image batch. Its size and unmasked pixels are kept.
-
 This id will keep working; it just will not grow new features.

js/docs/agents/README.md

@@ -1,8 +1,14 @@
-# AusBoss nodes: a workflow guide
+# AusBoss nodes: a guide for AI agents
 
-Find the job in the table below, then read that node's help page before
-wiring it. Each help page is `js/docs/<node id>.md` in this pack. ComfyUI
-shows the same page in its node help panel. This guide ships with the pack.
+Give this page to an AI agent and it can pick the right AusBoss node for a job,
+wire it into a workflow, and find the help for every input. It ships with the
+pack, so it is also in your ComfyUI install, under
+`custom_nodes/<this pack>/js/docs/agents/`.
+
+**If you are the agent:** find the job in the table below, then read that
+node's help page before you wire it. Each help page is
+`js/docs/<node id>.md` in this pack. ComfyUI shows the same page in its node
+help panel.
 
 ## Which node for which job
 
@@ -25,19 +31,21 @@ shows the same page in its node help panel. This guide ships with the pack.
 | Save pictures (PNG, lossless WebP or JPEG XL) | Save Image (`AUSBOSS_NODES_SaveImage`) |
 | Run a workflow on each picture in a folder | Image Folder (`AUSBOSS_NODES_ImageFolder`) |
 | Apply a stack of LoRAs | LoRA Loader (`AUSBOSS_NODES_LoraLoader`) |
+| Write a MiniMax H3 or Pika H3 Flex prompt from plain words | H3 Prompt Writer (`AUSBOSS_NODES_H3PromptWriter`): [node help](../AUSBOSS_NODES_H3PromptWriter.md) |
 | Krea 2 prompt, and Krea 2 outpainting | Krea 2 Encode (`AUSBOSS_NODES_Krea2Encode`), Krea 2 Outpaint Model Patch (`AUSBOSS_NODES_Krea2OutpaintModelPatch`) |
 | Load or save a video | Load Video (`AUSBOSS_NODES_LoadVideo`), Save Video (`AUSBOSS_NODES_SaveVideo`) |
+| Load a sound file and keep only part of it, up to a set length | Load Audio (`AUSBOSS_NODES_LoadAudio`) |
 | Turn, crop and pad a video: one frame, or the whole clip | Video Crop + Rotate + Pad → Frame (`AUSBOSS_NODES_VideoCropRotatePad`), → Clip (`AUSBOSS_NODES_VideoCropRotatePadClip`) |
 | Change a clip's frame rate | Frame Interpolate (`AUSBOSS_NODES_FrameInterpolate`) |
-| Work with frame batches | Select Frame (`AUSBOSS_NODES_SelectFrame`), Select Every Nth (`AUSBOSS_NODES_SelectEveryNth`), Split Batch (`AUSBOSS_NODES_SplitBatch`), Merge Batches (`AUSBOSS_NODES_MergeBatches`) |
-| One shared seed, number or text | Seed (`AUSBOSS_NODES_Seed`), Integer (`AUSBOSS_NODES_Integer`), Float (`AUSBOSS_NODES_Float`), Text (`AUSBOSS_NODES_Text`) |
-| Write a MiniMax H3 or Pika H3 Flex prompt from a script and references | H3 Prompt Writer (`AUSBOSS_NODES_H3PromptWriter`) |
+| Work with frame batches | Select Frame, Select Every Nth, Split Batch, Merge Batches (`AUSBOSS_NODES_SelectFrame`, `_SelectEveryNth`, `_SplitBatch`, `_MergeBatches`) |
+| One shared seed, number or text | Seed, Integer, Float, Text (`AUSBOSS_NODES_Seed`, `_Integer`, `_Float`, `_Text`) |
 | Do maths on numbers | Math Expression (`AUSBOSS_NODES_MathExpression`) |
 | Show text on the node, or the picture while it is made | Show Text (`AUSBOSS_NODES_ShowText`), Step Preview (`AUSBOSS_NODES_StepPreview`) |
 | Free graphics memory between steps | Free Memory (`AUSBOSS_NODES_FreeMemory`) |
 | Time the whole run | Run Timer (`AUSBOSS_NODES_RunTimer`) |
-| Turn parts of a workflow off and on | Workflow Switches (`AUSBOSS_NODES_WorkflowSwitches`): [workflow file guide](workflow_switches.md) |
+| Turn parts of a workflow off and on | Workflow Switches (`AUSBOSS_NODES_WorkflowSwitches`): [its own agent guide](workflow_switches.md) |
 | Explain a shared workflow on the canvas | Workflow Note (`AUSBOSS_NODES_WorkflowNote`), Callout (`AUSBOSS_NODES_Callout`) |
+| Add compact help or colored link buttons | Workflow Note Tile (`AUSBOSS_NODES_WorkflowNoteTile`), Callout Tile (`AUSBOSS_NODES_CalloutTile`) |
 | Lay out boxes of things and words on a canvas | Layout Boxes (`AUSBOSS_NODES_LayoutBoxes`) |
 
 Every node's display name ends in 🆎 and sits under `🆎 AusBoss/<group>` in
@@ -57,6 +65,20 @@ the `AUSBOSS_NODES_...` key above.
 - **Media loaders start blank** in the example workflows. Put in the file the
   person wants to use before you queue.
 
+## H3 swaps and clip duration
+
+For a swap, keep the target selector on its own line. An optional separate line,
+`@1 looks like a woman with blonde hair and a black hoodie.`, describes the
+connected replacement person in Picture 1; use its actual picture number. This
+can help express appearance but does not guarantee identity. Do not add it to
+other jobs. Existing scripts without it keep their previous behavior.
+
+An active video sets the duration for **swap the person**, **change something**
+and **new voice**. The card says **From the clip** and hides numeric timeline
+retiming; trim or limit the upstream clip instead. Do not infer the final frame
+count from raw source metadata: upstream processing and H3 frame rounding apply.
+Other jobs and video OFF still use **Length** normally.
+
 ## Example workflows
 
 `example_workflows/` in this pack holds complete workflows, each with a

js/docs/agents/workflow_switches.md

@@ -1,9 +1,12 @@
-# Workflow Switches: workflow file guide
+# Workflow Switches: a guide for AI agents
 
-Add switches by writing the card into a saved workflow file. The card is
-one node with no wires. It lists which nodes each switch controls in one
-property. Pick the recipe below that fits, add the card, and set the nodes'
-starting state.
+Give this page to an AI agent and it can add switches to a ComfyUI workflow
+for you. Nobody has to click through menus: the agent writes the card straight
+into the workflow file.
+
+**If you are the agent:** the card is one node in the workflow file. It has no
+wires. It lists which nodes each switch controls, in one property. Pick the
+recipe below that fits, add the card, and set the nodes' starting state.
 
 ## Before you start
 
@@ -91,9 +94,8 @@ To switch a whole group of nodes, put the group's `id` in `groups`.
 ### Pick one part
 
 One pill: picking a name turns its nodes on and the other rows' nodes off. Open
-it with one row's nodes at `0` and the rest at `4`. Two to four short names
-sit in a pill when they fit within 400 px. More rows or longer names become
-a list. A single row keeps the row view.
+it with one row's nodes at `0` and the rest at `4`. Up to 4 names sit in a
+pill, more become a list.
 
 ```json
 "exclusive": true,

js/docs/examples/model-download-tile.json

@@ -0,0 +1,51 @@
+{
+  "id": "27945e9e-3e7b-49c5-bcb7-434d5de9e689",
+  "revision": 0,
+  "last_node_id": 1,
+  "last_link_id": 0,
+  "nodes": [
+    {
+      "id": 1,
+      "type": "AUSBOSS_NODES_WorkflowNoteTile",
+      "pos": [
+        0,
+        0
+      ],
+      "size": [
+        300,
+        88
+      ],
+      "flags": {},
+      "order": 0,
+      "mode": 0,
+      "inputs": [],
+      "outputs": [],
+      "title": "Download models",
+      "properties": {
+        "Node name for S&R": "AUSBOSS_NODES_WorkflowNoteTile"
+      },
+      "widgets_values": [
+        "{\"v\": 1, \"title\": \"Download models\", \"subtitle\": \"Krea 2 Outpaint\", \"author\": \"\", \"layout\": \"tile\", \"accent\": \"\", \"body\": \"Get the four files below and put each one in its listed folder. Click **check files** after adding them.\", \"models\": [{\"name\": \"krea2_turbo_fp8_scaled.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"13.1 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Krea-2/resolve/main/diffusion_models/krea2_turbo_fp8_scaled.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_4b_fp8_scaled.safetensors\", \"dir\": \"text_encoders\", \"size\": \"5.2 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Krea-2/resolve/main/text_encoders/qwen3vl_4b_fp8_scaled.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_vae.safetensors\", \"dir\": \"vae\", \"size\": \"254 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Krea-2/resolve/main/vae/qwen_image_vae.safetensors\", \"note\": \"\"}, {\"name\": \"krea2_anypaint_rank32.safetensors\", \"dir\": \"loras\", \"size\": \"229 MB\", \"url\": \"https://huggingface.co/yijunwang2/krea2-anypaint/resolve/main/krea2_anypaint_rank32.safetensors\", \"note\": \"by yijunwang2\"}], \"packs\": [], \"links\": []}"
+      ],
+      "widgets_values_named": {
+        "note": "{\"v\": 1, \"title\": \"Download models\", \"subtitle\": \"Krea 2 Outpaint\", \"author\": \"\", \"layout\": \"tile\", \"accent\": \"\", \"body\": \"Get the four files below and put each one in its listed folder. Click **check files** after adding them.\", \"models\": [{\"name\": \"krea2_turbo_fp8_scaled.safetensors\", \"dir\": \"diffusion_models\", \"size\": \"13.1 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Krea-2/resolve/main/diffusion_models/krea2_turbo_fp8_scaled.safetensors\", \"note\": \"\"}, {\"name\": \"qwen3vl_4b_fp8_scaled.safetensors\", \"dir\": \"text_encoders\", \"size\": \"5.2 GB\", \"url\": \"https://huggingface.co/Comfy-Org/Krea-2/resolve/main/text_encoders/qwen3vl_4b_fp8_scaled.safetensors\", \"note\": \"\"}, {\"name\": \"qwen_image_vae.safetensors\", \"dir\": \"vae\", \"size\": \"254 MB\", \"url\": \"https://huggingface.co/Comfy-Org/Krea-2/resolve/main/vae/qwen_image_vae.safetensors\", \"note\": \"\"}, {\"name\": \"krea2_anypaint_rank32.safetensors\", \"dir\": \"loras\", \"size\": \"229 MB\", \"url\": \"https://huggingface.co/yijunwang2/krea2-anypaint/resolve/main/krea2_anypaint_rank32.safetensors\", \"note\": \"by yijunwang2\"}], \"packs\": [], \"links\": []}"
+      },
+      "color": "#14424d",
+      "bgcolor": "#161f21"
+    }
+  ],
+  "links": [],
+  "groups": [],
+  "config": {},
+  "extra": {
+    "ds": {
+      "scale": 0.9,
+      "offset": [
+        150,
+        115
+      ]
+    },
+    "frontendVersion": "1.53.6"
+  },
+  "version": 0.4
+}

js/editor_command/index.js

@@ -1,4 +1,4 @@
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import { showToast } from "../shared/index.mjs";
 import { openTransformEditorForNode } from "../shared/transform_editor.mjs";
 

js/face_handover/index.js

@@ -6,7 +6,7 @@
 // hand-over waits one microtask, so the frontend has rebuilt the whole graph
 // before any panel moves.
 
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import { chainCallback, isAusbossNode } from "../shared/index.mjs";
 import { createFaceHandover } from "../shared/face_handover.mjs";
 

js/image_crop_rotate_pad/index.js

@@ -33,7 +33,7 @@ function mountTransformPanel(node, panel) {
   fillNodeHeight(widget, {
     minWidth: PANEL_MIN_WIDTH,
     minHeight: () => transformPanelFloor(node),
-    minNodeSize: [PANEL_MIN_WIDTH, 470],
+    minNodeSize: [PANEL_MIN_WIDTH, 396],
     exactMinWidth: true,
   });
   return widget;

js/image_folder/index.js

@@ -16,8 +16,8 @@
 // files to this site?"). A page can neither word that question nor skip it,
 // so the node says what it means here while the file explorer is open.
 
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { BRAND, chainCallback, chainHandler, keepDomWidgetWidthAuto, notifyAusbossChange, showToast } from "../shared/index.mjs";
 import { fillNodeHeight } from "../shared/panel_layout.mjs";
 import { isForeignRun } from "../shared/prompt_scope.mjs";
@@ -26,6 +26,7 @@ import {
   childOf,
   countLine,
   foldersAddress,
+  folderContext,
   isPicked,
   listAddress,
   nameAt,
@@ -274,6 +275,7 @@ async function refresh(state) {
 }
 
 function scheduleRefresh(state, delay = 160) {
+  ++state.token;
   clearTimeout(state.timer);
   state.timer = setTimeout(() => refresh(state), delay);
 }
@@ -342,6 +344,7 @@ async function upload(file, subfolder, overwrite) {
 
 // Loose pictures go into the folder the node shows.
 async function addFiles(state, files) {
+  if (!state.alive) return false;
   const now = settings(state.node);
   const images = [...(files ?? [])].filter(isPicture);
   if (!images.length) return false;
@@ -352,10 +355,13 @@ async function addFiles(state, files) {
   const added = [];
   let failed = 0;
   for (const file of images) {
+    if (!state.alive) return true;
     const name = await upload(file, now.folder, false);
+    if (!state.alive) return true;
     if (name) added.push(name); else failed += 1;
   }
   await refresh(state);
+  if (!state.alive) return true;
   // A hand-made pick takes the new pictures in: they were just put there to be used.
   const picked = parsePicked(settings(state.node).pictures);
   if (picked !== null && added.length) setPicked(state, [...picked, ...added.filter((name) => state.names.includes(name))]);
@@ -388,6 +394,7 @@ function closeAsk(answer = false) {
 }
 
 function askBig(state, name, pictures) {
+  if (!state.alive) return Promise.resolve(false);
   const bytes = pictures.reduce((sum, item) => sum + (Number(item.file?.size) || 0), 0);
   if (pictures.length <= BIG_COUNT && bytes <= BIG_BYTES) return Promise.resolve(true);
   closeAsk(false);
@@ -404,7 +411,7 @@ function askBig(state, name, pictures) {
     foot.append(cancel, go);
     root.append(foot);
     const abort = new AbortController();
-    openAsk = { root, abort, done };
+    openAsk = { root, abort, done, state };
     cancel.addEventListener("click", () => closeAsk(false));
     go.addEventListener("click", () => closeAsk(true));
     document.body.append(root);
@@ -420,7 +427,17 @@ function askBig(state, name, pictures) {
 // input/<its name>, folders inside it too, and the node moves there. Copying
 // the same folder again writes over its copies instead of piling up doubles.
 async function copyFolder(state, name, pictures) {
-  if (!(await askBig(state, name, pictures)) || !state.alive) return;
+  if (!state.alive || state.copyLocked) return;
+  state.copyLocked = true;
+  try {
+    if (!(await askBig(state, name, pictures)) || !state.alive) return;
+    await copyPictures(state, name, pictures);
+  } finally {
+    state.copyLocked = false;
+  }
+}
+
+async function copyPictures(state, name, pictures) {
   const target = folderName(name);
   const queue = pictures.slice(0, COPY_LIMIT);
   state.copying = { done: 0, total: queue.length, name, target };
@@ -431,7 +448,9 @@ async function copyFolder(state, name, pictures) {
     for (;;) {
       const next = queue.shift();
       if (!next || !state.alive) return;
-      if (await upload(next.file, next.folder ? `${target}/${next.folder}` : target, true)) copied += 1;
+      const added = await upload(next.file, next.folder ? `${target}/${next.folder}` : target, true);
+      if (!state.alive) return;
+      if (added) copied += 1;
       state.copying.done += 1;
       paint(state);
       cover(state);
@@ -444,6 +463,7 @@ async function copyFolder(state, name, pictures) {
   if (!state.alive) return;
   const moved = write(state.node, "source", "input") | write(state.node, "folder", target);
   if (moved) notifyAusbossChange(); else await refresh(state);
+  if (!state.alive) return;
   paint(state);
   showToast({ detail: `Copied ${copied} picture${copied === 1 ? "" : "s"} from "${name}" into your ComfyUI input folder (input/${target}).` });
   if (copied < total) showToast({ severity: "warn", detail: `${total - copied} could not be copied.` });
@@ -506,7 +526,7 @@ function addMenu(state, anchor) {
   closeMenu();
   const root = el("div", "ausboss-if-menu");
   const abort = new AbortController();
-  openMenu = { root, abort };
+  openMenu = { root, abort, state };
   const row = (text, title, run) => {
     const button = el("button", "ausboss-if-browse-row", text);
     button.type = "button"; button.title = title;
@@ -545,19 +565,25 @@ async function browse(state, anchor) {
   foot.append(cancel, use);
   root.append(path, list, foot);
   const abort = new AbortController();
-  openBrowse = { root, abort };
+  openBrowse = { root, abort, state };
   let at = now.folder;
+  let source = now.source;
+  let navigation = 0;
 
   const show = async (folder) => {
+    const token = ++navigation;
+    use.disabled = true;
     let data = null;
     try {
-      const response = await api.fetchApi(foldersAddress({ source: now.source, folder }));
+      const response = await api.fetchApi(foldersAddress({ source, folder }));
       if (response.ok) data = await response.json();
     } catch { /* shown as an empty list below */ }
-    if (openBrowse?.root !== root) return;
+    if (openBrowse?.root !== root || token !== navigation || !state.alive) return;
     if (!data && folder) return show("");          // a folder that is gone: start at the top
     at = data?.folder ?? "";
-    path.replaceChildren(document.createTextNode(`${now.source} / `), el("b", "", at || "(the folder itself)"));
+    source = data?.source ?? source;
+    use.disabled = false;
+    path.replaceChildren(document.createTextNode(`${source} / `), el("b", "", at || "(the folder itself)"));
     list.replaceChildren();
     if (at) {
       const up = el("button", "ausboss-if-browse-row up", "↑ up");
@@ -582,7 +608,9 @@ async function browse(state, anchor) {
   };
 
   use.addEventListener("click", () => {
-    if (write(state.node, "folder", at)) notifyAusbossChange();
+    if (use.disabled || !state.alive) return;
+    const moved = write(state.node, "source", source) | write(state.node, "folder", at);
+    if (moved) notifyAusbossChange();
     closeBrowse();
   });
   cancel.addEventListener("click", closeBrowse);
@@ -706,6 +734,12 @@ function buildPanel(node) {
       const now = settings(node);
       const key = `${now.source}|${now.folder}|${now.subfolders}|${now.sort}`;
       if (key === state.key) { paint(state); return; }
+      const context = folderContext(now);
+      if (context !== state.context) {
+        state.done.clear();
+        state.loadedLine = "";
+        state.context = context;
+      }
       // Another folder holds other names: a pick made in the old one means nothing there.
       const moved = state.key && (now.source !== state.shown.source || now.folder !== state.shown.folder || now.subfolders !== state.shown.subfolders);
       state.key = key;
@@ -725,7 +759,9 @@ function buildPanel(node) {
       const now = settings(node);
       if (now.run !== "one per run" || isLinked(node, "position")) return;
       const count = pickedNames(parsePicked(now.pictures), state.names).length;
-      const next = nextPosition(now.position, count, now.afterRun, now.atTheEnd);
+      // The folder can change on disk or arrive through a link. Only the
+      // backend knows where it ends; a cached gallery must not cap "next".
+      const next = nextPosition(now.position, now.afterRun === "next" ? null : count, now.afterRun, now.atTheEnd);
       if (next !== now.position) { position.value = next; position.callback?.(next); }
     });
   }
@@ -748,6 +784,7 @@ function buildPanel(node) {
   });
 
   const now = settings(node);
+  state.context = folderContext(now);
   state.key = `${now.source}|${now.folder}|${now.subfolders}|${now.sort}`;
   rebuild(state);
   scheduleRefresh(state, 60);
@@ -773,12 +810,18 @@ app.registerExtension({
     });
     chainCallback(nodeType.prototype, "onConfigure", function (info) {
       const state = buildPanel(this);
+      ++state.token;
+      clearTimeout(state.timer);
+      state.done.clear();
+      state.loadedLine = "";
       // A node that comes with a size keeps it, the smallest one too.
       if (info?.size) state.sized = true;
       // A loaded workflow brings its own folder and its own pick.
       state.restoring = true;
       queueMicrotask(() => {
+        if (!state.alive) return;
         const now = settings(this);
+        state.context = folderContext(now);
         state.key = `${now.source}|${now.folder}|${now.subfolders}|${now.sort}`;
         state.restoring = false;
         scheduleRefresh(state, 30);
@@ -789,6 +832,7 @@ app.registerExtension({
       const state = this.__ausbossImageFolder;
       const note = output?.ausboss_image_folder?.[0];
       if (!state?.alive || !note) return;
+      if (!note.context || folderContext(note.context) !== folderContext(settings(this))) return;
       for (const name of note.names ?? []) state.done.add(name);
       const loaded = note.loaded ?? [];
       state.loadedLine = loaded.length === 1
@@ -805,9 +849,9 @@ app.registerExtension({
       state.abort.abort();
       state.choosing?.abort();
       clearTimeout(state.dropTimer);
-      if (openBrowse) closeBrowse();
-      if (openMenu) closeMenu();
-      if (openAsk?.root && state.grid.isConnected === false) closeAsk(false);
+      if (openBrowse?.state === state) closeBrowse();
+      if (openMenu?.state === state) closeMenu();
+      if (openAsk?.state === state) closeAsk(false);
     });
   },
 });

js/image_size/index.js

@@ -11,7 +11,7 @@
 // last text. The labels themselves are never saved, so an older version of
 // the pack shows the plain names.
 
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import { isForeignRun } from "../shared/prompt_scope.mjs";
 import { chainCallback } from "../shared/index.mjs";
 import { savedLabel, sizeLabel, sizesFromExecuted } from "../shared/image_size.mjs";

js/input_preview/index.js

@@ -14,11 +14,13 @@
 // switch lays each sampling step over the stage, with a Stop button on the
 // bar (shared/step_preview.mjs).
 
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { panelSwitch } from "../shared/panel_controls.mjs";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { isForeignRun } from "../shared/prompt_scope.mjs";
 import { executionIdOf, nodeByExecutionId } from "../shared/graph_ids.mjs";
-import { BRAND, chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange } from "../shared/index.mjs";
+import { FONT_UI, RADIUS_CONTROL, RADIUS_XS, THEME as T } from "../shared/theme.mjs";
+import { chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange } from "../shared/index.mjs";
 import { ensureNodeMinHeight, fillNodeHeight, growToNodeFloor } from "../shared/panel_layout.mjs";
 import { suppressCoreImagePreview } from "../shared/core_preview.mjs";
 import { autoMaskValues } from "../shared/mask_auto.mjs";
@@ -129,34 +131,29 @@ function ensureCss() {
   style.textContent = `
 .ausboss-input-preview{box-sizing:border-box;display:flex;flex-direction:column;gap:4px;width:100%;height:100%;padding:0 6px 6px;pointer-events:none;overflow:hidden;}
 .ausboss-input-preview-bar{box-sizing:border-box;flex:none;display:flex;align-items:center;gap:${BAR_GAP}px;height:${BAR_HEIGHT}px;padding:0 ${BAR_PADDING}px;pointer-events:none;}
-.ausboss-input-preview-stage{position:relative;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;width:100%;overflow:hidden;border:1px solid rgba(0,180,170,.27);border-radius:6px;background:rgba(0,0,0,.28);}
+.ausboss-input-preview-stage{position:relative;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;width:100%;overflow:hidden;border:1px solid ${T.rule};border-radius:${RADIUS_CONTROL}px;background:${T.well};}
 [data-node-id] .ausboss-input-preview-stage{box-sizing:border-box;min-height:${STAGE_HEIGHT}px;}
 .ausboss-input-preview.preview-off .ausboss-input-preview-stage{display:none;}
 .ausboss-input-preview.preview-off .ausboss-stepper{display:none;}
 .ausboss-input-preview-stage img,.ausboss-input-preview-stage video{display:none;position:absolute;inset:0;margin:auto;max-width:100%;max-height:100%;object-fit:contain;}
 .ausboss-input-preview-stage.show-image img{display:block;}
 .ausboss-input-preview-stage.show-video video{display:block;}
-.ausboss-input-preview-hint{display:none;max-width:86%;color:#78908e;font:11px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:center;}
+.ausboss-input-preview-hint{display:none;max-width:86%;color:${T.faint};font:11px/1.35 ${FONT_UI};text-align:center;}
 .ausboss-input-preview-stage:not(.show-image):not(.show-video) .ausboss-input-preview-hint{display:block;}
 .ausboss-input-preview-tools{display:flex;gap:4px;pointer-events:auto;}
-.ausboss-input-preview-tool{box-sizing:border-box;height:${BAR_HEIGHT}px;min-width:24px;padding:0 6px;border:1px solid rgba(0,180,170,.52);border-radius:4px;background:rgba(0,0,0,.7);color:#c8dddd;font:700 9px/18px "Segoe UI",sans-serif;cursor:pointer;}
-.ausboss-input-preview-tool:hover{border-color:${BRAND};color:#fff;background:rgba(0,79,75,.78);}
-.ausboss-input-preview-tool.active{border-color:${BRAND};color:${BRAND};}
-.ausboss-input-preview-toggle{display:flex;align-items:center;gap:6px;margin-left:auto;pointer-events:auto;cursor:pointer;user-select:none;}
-.ausboss-input-preview:not(.preview-off) .ausboss-input-preview-toggle.steps + .ausboss-input-preview-toggle{margin-left:0;}
-.ausboss-input-preview.preview-off .ausboss-input-preview-toggle.steps{display:none;}
+.ausboss-input-preview-tool{box-sizing:border-box;height:${BAR_HEIGHT}px;min-width:24px;padding:0 6px;border:1px solid transparent;border-radius:${RADIUS_XS}px;background:${T.fill};color:${T.label};font:600 9.5px/18px ${FONT_UI};letter-spacing:.02em;cursor:pointer;}
+.ausboss-input-preview-tool:hover{color:${T.ink};background:${T.fillHover};}
+.ausboss-input-preview-tool.active{color:${T.brandInk};background:${T.brandSoft};}
+.ausboss-input-preview-tool:focus-visible{outline:2px solid ${T.brand};outline-offset:1px;}
+.ausboss-input-preview:not(.preview-off) .ausboss-panel-switch.steps + .ausboss-panel-switch{margin-left:0;}
+.ausboss-input-preview.preview-off .ausboss-panel-switch.steps{display:none;}
 .ausboss-input-preview-tool.ausboss-steps-stop{visibility:hidden;}
 .ausboss-input-preview-tool.ausboss-steps-stop.live{visibility:visible;pointer-events:auto;}
-.ausboss-input-preview-toggle span{color:#5f7674;font:10px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.08em;text-transform:uppercase;}
-.ausboss-input-preview-switch{box-sizing:border-box;width:24px;height:13px;border-radius:7px;border:none;background:#3a4047;position:relative;cursor:pointer;padding:0;flex:none;pointer-events:auto}
-.ausboss-input-preview-switch::after{content:"";position:absolute;top:2px;left:2px;width:9px;height:9px;border-radius:50%;background:#9ba2aa;transition:left .12s}
-.ausboss-input-preview-switch.on{background:${BRAND}}
-.ausboss-input-preview-switch.on::after{left:13px;background:#fff}
-.ausboss-input-preview-readout{box-sizing:border-box;height:${BAR_HEIGHT}px;padding:0 7px;border:1px solid rgba(0,180,170,.5);border-radius:10px;background:rgba(0,180,170,.14);color:${BRAND};font:700 9.5px/18px "Segoe UI",sans-serif;white-space:nowrap;pointer-events:none;}
+.ausboss-input-preview-readout{box-sizing:border-box;height:${BAR_HEIGHT}px;padding:0 7px;border:1px solid transparent;border-radius:999px;background:${T.brandSoft};color:${T.brandInk};font:600 9.5px/18px ${FONT_UI};font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;}
 .ausboss-input-preview-readout:empty{display:none;}
-.ausboss-input-preview-readout.warn{border-color:#c98a2b;background:rgba(201,138,43,.16);color:#ffd9a0;}
-.ausboss-input-preview-note{display:none;position:absolute;left:6px;right:6px;bottom:6px;z-index:6;padding:6px 8px;border:1px solid #c98a2b;border-radius:6px;background:rgba(20,10,0,.86);color:#ffd9a0;font:600 11px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:center;pointer-events:none;}
-.ausboss-input-preview-toast{position:absolute;left:50%;bottom:6px;z-index:5;max-width:88%;padding:3px 7px;border-radius:4px;background:rgba(0,0,0,.78);color:#b8d3d1;font:10px/1.3 "Segoe UI",sans-serif;text-align:center;transform:translateX(-50%);pointer-events:none;}
+.ausboss-input-preview-readout.warn{background:${T.warnSoft};color:${T.warnInk};}
+.ausboss-input-preview-note{display:none;position:absolute;left:6px;right:6px;bottom:6px;z-index:6;padding:6px 8px;border:1px solid ${T.warn};border-radius:${RADIUS_CONTROL}px;background:${T.warnSoft};color:${T.warnInk};font:600 11px/1.35 ${FONT_UI};text-align:center;pointer-events:none;}
+.ausboss-input-preview-toast{position:absolute;left:50%;bottom:6px;z-index:5;max-width:88%;padding:3px 7px;border-radius:${RADIUS_XS}px;background:${T.fill};color:${T.inkSoft};font:10px/1.3 ${FONT_UI};text-align:center;transform:translateX(-50%);pointer-events:none;}
 `;
   document.head.appendChild(style);
 }
@@ -297,18 +294,9 @@ function previewEnabled(state) {
 }
 
 function makePreviewToggle(state, signal) {
-  const toggle = document.createElement("div");
-  toggle.className = "ausboss-input-preview-toggle";
-  toggle.title = state.switchTitle ?? "Show this node's result here. Off also skips writing the preview file to the temp folder.";
-  const caption = document.createElement("span");
-  caption.textContent = "preview";
-  const button = document.createElement("button");
-  button.type = "button";
-  button.className = "ausboss-input-preview-switch";
-  button.setAttribute("role", "switch");
-  toggle.append(caption, button);
-  toggle.addEventListener("pointerdown", (event) => event.stopPropagation(), { signal });
-  toggle.addEventListener("click", (event) => {
+  const button = panelSwitch("Preview", state.switchTitle ?? "Show this node's result here. Off also skips writing the preview file to the temp folder.");
+  button.addEventListener("pointerdown", (event) => event.stopPropagation(), { signal });
+  button.addEventListener("click", (event) => {
     event.preventDefault(); event.stopPropagation();
     const next = !previewEnabled(state);
     state.previewWidget.value = next;
@@ -317,7 +305,7 @@ function makePreviewToggle(state, signal) {
     notifyAusbossChange();
   }, { signal });
   state.switchButton = button;
-  return toggle;
+  return button;
 }
 
 function installPreviewSwitch(state, signal) {
@@ -348,18 +336,10 @@ function installStepsSwitch(state, signal) {
   if (!widget) return;
   state.stepsWidget = widget;
   hideWidget(widget);
-  const toggle = document.createElement("div");
-  toggle.className = "ausboss-input-preview-toggle steps";
-  toggle.title = "Show the picture here while it is being made, one step at a time, with a Stop button. Off by default.";
-  const caption = document.createElement("span");
-  caption.textContent = "steps";
-  const button = document.createElement("button");
-  button.type = "button";
-  button.className = "ausboss-input-preview-switch";
-  button.setAttribute("role", "switch");
-  toggle.append(caption, button);
-  toggle.addEventListener("pointerdown", (event) => event.stopPropagation(), { signal });
-  toggle.addEventListener("click", (event) => {
+  const button = panelSwitch("Preview steps", "Show the picture here while it is being made, one step at a time, with a Stop button. Off by default.");
+  button.classList.add("steps");
+  button.addEventListener("pointerdown", (event) => event.stopPropagation(), { signal });
+  button.addEventListener("click", (event) => {
     event.preventDefault(); event.stopPropagation();
     const next = widget.value !== true;
     widget.value = next;
@@ -368,9 +348,9 @@ function installStepsSwitch(state, signal) {
     notifyAusbossChange();
   }, { signal });
   state.stepsButton = button;
-  const previewToggle = state.switchButton?.parentElement;
-  if (previewToggle?.parentElement === state.bar) state.bar.insertBefore(toggle, previewToggle);
-  else state.bar.append(toggle);
+  const previewToggle = state.switchButton;
+  if (previewToggle?.parentElement === state.bar) state.bar.insertBefore(button, previewToggle);
+  else state.bar.append(button);
 
   // Stop sits where the node's tools go; it keeps its place while hidden so
   // the bar never shifts when a run starts.
@@ -408,7 +388,6 @@ function syncSteps(state, run = stepRun()) {
   if (typeof state.placeholder === "boolean") state.hint.textContent = placeholderText(state.placeholder, state.noun, runningFor(state, run));
   const on = stepsEnabled(state);
   if (state.stepsButton) {
-    state.stepsButton.classList.toggle("on", state.stepsWidget?.value === true);
     state.stepsButton.setAttribute("aria-checked", String(state.stepsWidget?.value === true));
   }
   state.stopButton?.classList.toggle("live", on && run.status === "running");
@@ -463,12 +442,11 @@ function syncPreviewMode(state, resize) {
   const enabled = previewEnabled(state);
   state.root.classList.toggle("preview-off", !enabled);
   if (state.switchButton) {
-    state.switchButton.classList.toggle("on", enabled);
     state.switchButton.setAttribute("aria-checked", String(enabled));
   }
   if (!enabled) {
     // Nothing to show and nothing to fetch while it is off.
-    state.img.removeAttribute("src");
+    clearMedia(state);
   }
   if (resize) {
     const node = state.node;
@@ -541,14 +519,16 @@ function clearMedia(state) {
   state.video.removeAttribute("src");
 }
 
-// Restore the watched widget's callback if our hook is still the tail of the
-// chain; if someone chained after us the hook simply goes inert via
-// state.alive. We never create object URLs, so there is nothing to revoke.
+// Each source has one hook, with subscribers that can leave in any order.
+const sourceWatchers = new WeakMap();
 function unwatchSource(state) {
   const watched = state.watched;
   state.watched = null;
-  if (watched && watched.widget.callback === watched.hook) {
+  if (!watched) return;
+  watched.subscribers.delete(state);
+  if (!watched.subscribers.size && watched.widget.callback === watched.hook) {
     watched.widget.callback = watched.prior;
+    sourceWatchers.delete(watched.widget);
   }
 }
 
@@ -557,14 +537,21 @@ function rewatchSource(state, source) {
   if (state.watched?.widget === widget) return;
   unwatchSource(state);
   if (!widget) return;
-  const prior = widget.callback;
-  const hook = function (...args) {
-    const result = prior?.apply(this, args);
-    if (state.alive) scheduleRefresh(state);
-    return result;
-  };
-  widget.callback = hook;
-  state.watched = { widget, prior, hook };
+  let watched = sourceWatchers.get(widget);
+  if (!watched) {
+    const prior = widget.callback;
+    const subscribers = new Set();
+    const hook = function (...args) {
+      const result = prior?.apply(this, args);
+      for (const subscriber of subscribers) if (subscriber.alive) scheduleRefresh(subscriber);
+      return result;
+    };
+    watched = { widget, prior, hook, subscribers };
+    sourceWatchers.set(widget, watched);
+    widget.callback = hook;
+  }
+  watched.subscribers.add(state);
+  state.watched = watched;
 }
 
 // The node's stored output as a /view URL, for Nodes 2.0, where node.imgs
@@ -608,6 +595,10 @@ function stepPicture(state, step) {
 
 function refresh(state) {
   if (!state.alive) return;
+  if (!previewEnabled(state)) {
+    clearMedia(state);
+    return;
+  }
   const source = upstreamNode(state.node, state.inputName);
   rewatchSource(state, source);
   const count = resultCount(state);
@@ -849,9 +840,9 @@ app.registerExtension({
       if (state) scheduleRefresh(state);
     });
     chainCallback(nodeType.prototype, "onConfigure", function () {
+      const state = this.__ausbossInputPreview;
       queueMicrotask(() => {
-        const state = buildPanel(this, config);
-        if (!state) return;
+        if (!state?.alive || this.__ausbossInputPreview !== state) return;
         // onNodeCreated already built the panel before this node's saved
         // properties existed, so the advanced toggle has to be re-applied
         // here or a workflow always reopens in the simple state.

js/layout_boxes/index.js

@@ -17,8 +17,8 @@
 // it. Ctrl (or Alt) while dragging leaves the grid off. The grid starts off
 // over a picture on `background`; a click on Grid is saved with the node.
 
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { BRAND, chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange, showToast } from "../shared/index.mjs";
 import { keepKeyInField } from "../shared/canvas_passthrough.mjs";
 import { describeSourcePreview, outputLocatorId } from "../shared/input_preview.mjs";

js/line_up/index.js

@@ -1,4 +1,4 @@
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import { BRAND, notifyAusbossChange, showToast } from "../shared/index.mjs";
 import { enoughFor, lineUp, matchWidth, sameSize, sharedSides, spreadEvenly } from "../shared/line_up.mjs";
 import { outlineOf } from "../shared/outline.mjs";
@@ -288,6 +288,9 @@ function syncSizes() {
   const grabbed = together.grabbed;
   if (!grabbed) return;
   const was = together.before.get(grabbed);
+  // A handle click is not a resize. Once a drag starts, keep syncing even
+  // when it returns to its starting size so the other nodes follow it back.
+  if (!together.sides && grabbed.size[0] === was.size[0] && grabbed.size[1] === was.size[1]) return;
   together.sides ??= sharedSides(
     [...together.before.values()].map(({ pos, size }) => ({ x: pos[0], y: pos[1], w: size[0], h: size[1] })),
   );

js/load_audio/audio_window.mjs

@@ -0,0 +1,84 @@
+// Load Audio's window rules for the face, mirroring audio_window in
+// nodes/_audio_trim_helpers.py so the wave shows exactly what one Run hands
+// on. Pure: tests/load_audio_window.test.mjs runs it without a browser.
+
+function finite(value, fallback = 0) {
+  const number = Number(value);
+  return Number.isFinite(number) ? number : fallback;
+}
+
+// The pick, and what comes out of it. `end` 0 means "to the end of the
+// file". A max above 0 keeps the start and cuts off anything past
+// start + max. All times in seconds; duration is the file's length.
+export function outputWindow(durationValue, startValue, endValue, maxValue = 0) {
+  const duration = Math.max(0, finite(durationValue));
+  const start = Math.min(Math.max(0, finite(startValue)), duration);
+  const pickedEnd = finite(endValue) > 0 ? Math.min(finite(endValue), duration) : duration;
+  const end = Math.max(start, pickedEnd);
+  const max = Math.max(0, finite(maxValue));
+  const keepEnd = max > 0 && end - start > max ? Math.min(duration, start + max) : end;
+  return { start, end, keepEnd, length: keepEnd - start, cut: Math.max(0, end - keepEnd) };
+}
+
+// "0:12.0" style, the way the IN and OUT fields write a time.
+export function secondsLabel(value) {
+  const seconds = Math.max(0, finite(value));
+  if (seconds < 60) return `${seconds.toFixed(1)} s`;
+  const minutes = Math.floor(seconds / 60);
+  return `${minutes}:${(seconds - minutes * 60).toFixed(1).padStart(4, "0")}`;
+}
+
+// The line between IN and OUT: what comes out, and what the max cuts off.
+export function outputSummary(window, { maxFromLink = false } = {}) {
+  if (!window || window.length <= 0) return "";
+  const parts = [secondsLabel(window.length)];
+  if (window.cut > 0.005) parts.push(`cut ${secondsLabel(window.cut)}`);
+  if (maxFromLink) parts.push("max wired");
+  return parts.join(" · ");
+}
+
+// Loud and quiet across the file: for each of `buckets` slices, the lowest
+// and highest sample of the channels mixed down. Channel data is a list of
+// Float32Arrays (AudioBuffer.getChannelData). Returns a Float32Array of
+// [min0, max0, min1, max1, ...].
+export function wavePeaks(channels, bucketsValue = 1200) {
+  const list = Array.isArray(channels) ? channels.filter(Boolean) : [];
+  const buckets = Math.max(1, Math.floor(finite(bucketsValue, 1200)));
+  const peaks = new Float32Array(buckets * 2);
+  const length = list.length ? list[0].length : 0;
+  if (!length) return peaks;
+  const count = list.length;
+  for (let bucket = 0; bucket < buckets; bucket += 1) {
+    const from = Math.floor((bucket * length) / buckets);
+    const to = Math.max(from + 1, Math.floor(((bucket + 1) * length) / buckets));
+    let low = 0;
+    let high = 0;
+    for (let index = from; index < to && index < length; index += 1) {
+      let sample = 0;
+      for (let channel = 0; channel < count; channel += 1) sample += list[channel][index] || 0;
+      sample /= count;
+      if (sample < low) low = sample;
+      if (sample > high) high = sample;
+    }
+    peaks[bucket * 2] = low;
+    peaks[bucket * 2 + 1] = high;
+  }
+  return peaks;
+}
+
+// Which part of the wave a press at `fraction` (0..1 across it) grabs: a
+// handle within `hitPixels` of it, the inside of the pick to slide it, or
+// "jump" to move the pick there.
+export function grabZone(window, durationValue, fraction, widthValue, hitPixels = 10) {
+  const duration = Math.max(0, finite(durationValue));
+  const width = Math.max(0, finite(widthValue));
+  if (duration <= 0 || width <= 0) return "none";
+  const x = Math.min(1, Math.max(0, finite(fraction))) * width;
+  const startX = (window.start / duration) * width;
+  const endX = (window.end / duration) * width;
+  const toStart = Math.abs(x - startX);
+  const toEnd = Math.abs(x - endX);
+  if (Math.min(toStart, toEnd) <= hitPixels) return toStart <= toEnd ? "start" : "end";
+  if (x > startX && x < endX) return "move";
+  return "jump";
+}

js/load_audio/index.js

@@ -0,0 +1,574 @@
+// Load Audio 🆎 - the wave, the trim and the player.
+//
+// The card above (js/widget_cards) holds Source and Max length. This panel
+// draws the whole file as a wave: the part that comes out is bright, the
+// part a Max length cuts off is red, and the rest is dim. Drag a handle to
+// move IN or OUT, drag the middle to slide the pick, or click elsewhere to
+// move it there. Play plays only what comes out. The widgets underneath
+// (start_seconds, end_seconds, max_seconds) stay the source of truth.
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
+import { BRAND, chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange, showToast } from "../shared/index.mjs";
+import { keepKeyInField } from "../shared/canvas_passthrough.mjs";
+import { WIDGET_FRAME, fillNodeHeight } from "../shared/panel_layout.mjs";
+import { formatTimecode, parseTimecode } from "../shared/timecode.mjs";
+import { parseImageReference } from "../shared/pad_canvas.mjs";
+import { mediaViewQuery, splitMediaName } from "../shared/video_preview.mjs";
+import { ensureVideoCss, hideCanvasWidget, makeToolButton } from "../shared/video_ui.mjs";
+import { MIN_TRIM_SECONDS, dragTrimHandle, slideTrimWindow } from "../load_video/trim_preview.mjs";
+import { grabZone, outputSummary, outputWindow, secondsLabel, wavePeaks } from "./audio_window.mjs";
+
+const NODE_NAME = "AUSBOSS_NODES_LoadAudio";
+const PANEL_WIDGET = "ausboss_load_audio_wave";
+// The frontend's own player for an audio_upload input. The wave replaces it.
+const CORE_AUDIO_WIDGET = "audioUI";
+const MIN_WIDTH = 280;
+// 8px root padding + the wave's 28px floor + 6px gap + the 22px play, IN/OUT and loop row.
+const PANEL_MIN_HEIGHT = 64;
+// Opens small and neat: 300 px wide, with a wave about as tall as a field
+// (32 px). Drag the corner down for a taller wave.
+const DEFAULT_WIDTH = 300;
+const DEFAULT_WAVE_EXTRA = 4;
+const CUT_RED = "#e0525a";
+const PEAK_BUCKETS = 1600;
+const END_EPSILON = 0.03;
+
+// Decoded once per file and kept small: only the peaks and the length.
+const peakCache = new Map();
+
+function findWidget(node, name) {
+  return node.widgets?.find((widget) => widget.name === name);
+}
+
+function roundHundredth(value) {
+  return Math.round(Number(value || 0) * 100) / 100;
+}
+
+function hideCoreAudio(node) {
+  for (const widget of node.widgets ?? []) {
+    if (widget?.name === CORE_AUDIO_WIDGET) hideCanvasWidget(widget, widget.element);
+  }
+}
+
+// A wired Max length: the number the wire carries, when the far end is a
+// node that shows it (Float, Integer, a Primitive). null when it can't be known.
+function wiredMax(node) {
+  const input = node.inputs?.find((slot) => slot?.widget?.name === "max_seconds");
+  if (!input || input.link == null) return { wired: false, value: null };
+  const graph = node.graph;
+  const link = graph?.getLink?.(input.link) ?? graph?.links?.get?.(input.link) ?? graph?.links?.[input.link];
+  const origin = link ? graph?.getNodeById?.(link.origin_id) : null;
+  const shown = origin?.widgets?.find((widget) => typeof widget?.value === "number");
+  return { wired: true, value: shown ? Number(shown.value) : null };
+}
+
+function maxSeconds(state) {
+  const wired = wiredMax(state.node);
+  if (wired.wired) return { value: wired.value ?? 0, fromLink: true, known: wired.value != null };
+  return { value: Number(state.maxWidget?.value) || 0, fromLink: false, known: true };
+}
+
+function currentWindow(state) {
+  return outputWindow(state.duration, state.startWidget.value, state.endWidget.value, maxSeconds(state).value);
+}
+
+async function loadPeaks(name, route) {
+  const key = name;
+  if (peakCache.has(key)) return peakCache.get(key);
+  const job = (async () => {
+    const response = await api.fetchApi(route, { cache: "no-store" });
+    if (!response.ok) throw new Error(`the file could not be read (${response.status})`);
+    const bytes = await response.arrayBuffer();
+    const Context = window.AudioContext || window.webkitAudioContext;
+    const context = new Context();
+    try {
+      const buffer = await context.decodeAudioData(bytes);
+      const channels = [];
+      for (let index = 0; index < buffer.numberOfChannels; index += 1) channels.push(buffer.getChannelData(index));
+      return { duration: buffer.duration, peaks: wavePeaks(channels, PEAK_BUCKETS) };
+    } finally {
+      context.close?.();
+    }
+  })();
+  peakCache.set(key, job);
+  job.catch(() => peakCache.delete(key));
+  return job;
+}
+
+function ensureAudioCss() {
+  ensureVideoCss();
+  if (document.getElementById("ausboss-load-audio-css")) return;
+  const style = document.createElement("style");
+  style.id = "ausboss-load-audio-css";
+  style.textContent = `
+.ausboss-audio-root .ausboss-video-stage{min-height:28px;background:#050b0b;cursor:pointer;touch-action:none;}
+.ausboss-audio-error{pointer-events:auto;border:0;background:transparent;color:#e6bf87;font:11px system-ui;cursor:pointer;white-space:nowrap}
+.ausboss-audio-root canvas.ausboss-audio-wave{position:absolute;inset:0;width:100%;height:100%;display:block;}
+.ausboss-audio-root .ausboss-video-stage:not(.is-empty) .ausboss-video-status{display:none;}
+.ausboss-audio-root .ausboss-audio-row{display:flex;align-items:center;gap:6px;flex:none;padding:0 2px;}
+.ausboss-audio-root .ausboss-audio-row .ausboss-video-values{flex:1 1 auto;min-width:0;}
+.ausboss-audio-root .ausboss-audio-play{min-width:30px;font-size:10px;}
+.ausboss-audio-root .ausboss-audio-length{flex:none;padding:0 2px;color:#7fd9d2;font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap;cursor:default;}
+.ausboss-audio-root .ausboss-audio-length:empty{display:none;}
+.ausboss-audio-root .ausboss-audio-length.has-cut{color:#ff9aa0;cursor:pointer;text-decoration:underline dotted rgba(224,82,90,.8);text-underline-offset:2px;}
+.ausboss-audio-root .ausboss-audio-row .ausboss-video-tool{flex:none;}
+.ausboss-audio-root .ausboss-video-values{display:flex;gap:8px;}
+.ausboss-audio-root .ausboss-video-value input{width:48px;}
+.ausboss-audio-root .ausboss-audio-length{margin-left:auto;}
+`;
+  document.head.appendChild(style);
+}
+
+function draw(state) {
+  const { canvas } = state;
+  const rect = canvas.getBoundingClientRect();
+  const scale = window.devicePixelRatio || 1;
+  const width = Math.max(1, Math.round(rect.width * scale));
+  const height = Math.max(1, Math.round(rect.height * scale));
+  if (canvas.width !== width || canvas.height !== height) {
+    canvas.width = width;
+    canvas.height = height;
+  }
+  const ctx = canvas.getContext("2d");
+  ctx.clearRect(0, 0, width, height);
+  if (!state.peaks || state.duration <= 0) return;
+  const win = currentWindow(state);
+  const xOf = (seconds) => (seconds / state.duration) * width;
+  const startX = xOf(win.start);
+  const keepX = xOf(win.keepEnd);
+  const endX = xOf(win.end);
+  // Backdrops: the part that comes out, then the part cut off.
+  ctx.fillStyle = "rgba(0,180,170,0.13)";
+  ctx.fillRect(startX, 0, keepX - startX, height);
+  if (endX > keepX) {
+    ctx.fillStyle = "rgba(224,82,90,0.16)";
+    ctx.fillRect(keepX, 0, endX - keepX, height);
+  }
+  // The wave, one bar per pixel column.
+  const mid = height / 2;
+  const reach = mid * 0.92;
+  const buckets = state.peaks.length / 2;
+  for (let x = 0; x < width; x += 1) {
+    const from = Math.floor((x / width) * buckets);
+    const to = Math.max(from + 1, Math.floor(((x + 1) / width) * buckets));
+    let low = 0;
+    let high = 0;
+    for (let bucket = from; bucket < to && bucket < buckets; bucket += 1) {
+      low = Math.min(low, state.peaks[bucket * 2]);
+      high = Math.max(high, state.peaks[bucket * 2 + 1]);
+    }
+    if (x >= startX && x < keepX) ctx.fillStyle = BRAND;
+    else if (x >= keepX && x < endX) ctx.fillStyle = CUT_RED;
+    else ctx.fillStyle = "#3a4948";
+    const top = mid - high * reach;
+    ctx.fillRect(x, top, 1, Math.max(1, (high - low) * reach));
+  }
+  // The handles: IN and OUT, and a dashed line where the max cuts off.
+  // The grips stay small on a short wave so they don't hide it.
+  const grip = Math.round(Math.max(3, Math.min(7, rect.height * 0.12)) * scale);
+  const handle = (x, color) => {
+    ctx.fillStyle = color;
+    ctx.fillRect(Math.round(x) - scale, 0, 2 * scale, height);
+    ctx.fillRect(Math.round(x) - 4 * scale, 0, 8 * scale, grip);
+    ctx.fillRect(Math.round(x) - 4 * scale, height - grip, 8 * scale, grip);
+  };
+  handle(startX, "#f4ffff");
+  handle(endX, "#f4ffff");
+  if (endX > keepX + 1) {
+    ctx.strokeStyle = CUT_RED;
+    ctx.lineWidth = 2 * scale;
+    ctx.setLineDash([4 * scale, 3 * scale]);
+    ctx.beginPath();
+    ctx.moveTo(keepX, 0);
+    ctx.lineTo(keepX, height);
+    ctx.stroke();
+    ctx.setLineDash([]);
+  }
+  // The playhead while it plays, or where it paused inside the pick.
+  if (state.audio && !state.audio.paused) {
+    const x = xOf(state.audio.currentTime);
+    ctx.fillStyle = "#ffffff";
+    ctx.fillRect(x - scale / 2, 0, scale, height);
+  }
+}
+
+function updateFace(state) {
+  const win = currentWindow(state);
+  const max = maxSeconds(state);
+  if (document.activeElement !== state.startInput) state.startInput.value = formatTimecode(win.start);
+  if (document.activeElement !== state.endInput) state.endInput.value = formatTimecode(win.end);
+  if (state.duration > 0) {
+    const summary = outputSummary(win, { maxFromLink: max.fromLink && !max.known });
+    state.summary.textContent = win.length > 0 ? secondsLabel(win.length) : "";
+    state.summary.classList.toggle("has-cut", win.cut > 0.005);
+    state.summary.title = win.cut > 0.005
+      ? `${summary}. Max length is ${max.value} s, so ${formatTimecode(win.keepEnd)} to ${formatTimecode(win.end)} is cut off (red). Click to move OUT to ${formatTimecode(win.keepEnd)}.`
+      : `${summary}: ${formatTimecode(win.start)} to ${formatTimecode(win.keepEnd)} comes out.`;
+  } else {
+    state.summary.textContent = "";
+  }
+  draw(state);
+}
+
+function writeWidget(widget, value) {
+  const next = roundHundredth(value);
+  if (Math.abs(Number(widget.value || 0) - next) < 0.0001) return;
+  widget.value = next;
+  widget.callback?.(next);
+}
+
+function writeTrim(state, bounds) {
+  state.writing = true;
+  try {
+    writeWidget(state.startWidget, bounds.start);
+    // OUT at the very end stays 0, the widget's own "to the end".
+    writeWidget(state.endWidget, bounds.end >= state.duration - 0.005 ? 0 : bounds.end);
+  } finally {
+    state.writing = false;
+  }
+  updateFace(state);
+  state.node.setDirtyCanvas?.(true, true);
+}
+
+function installDrag(state) {
+  const surface = state.stage;
+  const infoAt = (clientX) => {
+    const rect = state.canvas.getBoundingClientRect();
+    const fraction = rect.width ? Math.min(1, Math.max(0, (clientX - rect.left) / rect.width)) : 0;
+    const win = currentWindow(state);
+    return { fraction, win, zone: grabZone(win, state.duration, fraction, rect.width) };
+  };
+  surface.addEventListener("pointermove", (event) => {
+    if (state.dragging || state.duration <= 0) return;
+    const { zone } = infoAt(event.clientX);
+    surface.style.cursor = zone === "start" || zone === "end" ? "ew-resize" : zone === "move" ? "grab" : "pointer";
+  });
+  surface.addEventListener("pointerdown", (event) => {
+    if (event.button !== 0 || state.dragging || state.duration <= 0) return;
+    event.preventDefault();
+    event.stopPropagation();
+    const initial = infoAt(event.clientX);
+    const bounds = { start: initial.win.start, end: initial.win.end };
+    const anchor = initial.fraction * state.duration;
+    const downX = event.clientX;
+    let moved = false;
+    state.dragging = true;
+    try { surface.setPointerCapture(event.pointerId); } catch (_error) { /* mouse fallback */ }
+    const centred = (fraction) => {
+      const span = bounds.end - bounds.start;
+      return slideTrimWindow(state.duration, bounds, fraction * state.duration - span / 2 - bounds.start);
+    };
+    const apply = (clientX) => {
+      const next = infoAt(clientX);
+      if (initial.zone === "start" || initial.zone === "end") {
+        const now = currentWindow(state);
+        writeTrim(state, dragTrimHandle(state.duration, { start: now.start, end: now.end }, initial.zone, next.fraction, MIN_TRIM_SECONDS));
+      } else if (initial.zone === "move") {
+        writeTrim(state, slideTrimWindow(state.duration, bounds, next.fraction * state.duration - anchor));
+      } else {
+        writeTrim(state, centred(next.fraction));
+      }
+    };
+    const move = (moveEvent) => {
+      if (!(moveEvent.buttons & 1)) { finish(moveEvent); return; }
+      if (!moved && Math.abs(moveEvent.clientX - downX) < 3) return;
+      moved = true;
+      apply(moveEvent.clientX);
+    };
+    const finish = (finishEvent) => {
+      if (!state.dragging) return;
+      state.dragging = false;
+      surface.removeEventListener("pointermove", move);
+      try { surface.releasePointerCapture(event.pointerId); } catch (_error) { /* already released */ }
+      if (!moved && initial.zone === "jump") writeTrim(state, centred(infoAt(finishEvent?.clientX ?? downX).fraction));
+      if (moved || initial.zone === "jump") {
+        if (state.audio && !state.audio.paused) state.audio.currentTime = currentWindow(state).start;
+        notifyAusbossChange();
+      }
+    };
+    surface.addEventListener("pointermove", move);
+    surface.addEventListener("pointerup", finish, { once: true });
+    surface.addEventListener("pointercancel", finish, { once: true });
+    surface.addEventListener("lostpointercapture", finish, { once: true });
+  });
+}
+
+function loopEnabled(node) {
+  node.properties ??= {};
+  return !!node.properties.ausboss_load_audio_loop;
+}
+
+function installPlayer(state) {
+  const audio = state.audio;
+  const stop = () => {
+    if (state.raf) cancelAnimationFrame(state.raf);
+    state.raf = 0;
+    state.playButton.textContent = "▶";
+    state.playButton.classList.remove("active");
+    draw(state);
+  };
+  const tick = () => {
+    if (audio.paused) { stop(); return; }
+    const win = currentWindow(state);
+    if (audio.currentTime >= win.keepEnd - END_EPSILON || audio.currentTime < win.start - 0.25) {
+      if (loopEnabled(state.node)) audio.currentTime = win.start;
+      else { audio.pause(); audio.currentTime = win.start; stop(); return; }
+    }
+    draw(state);
+    state.raf = requestAnimationFrame(tick);
+  };
+  audio.addEventListener("play", () => {
+    state.playButton.textContent = "❚❚";
+    state.playButton.classList.add("active");
+    if (state.raf) cancelAnimationFrame(state.raf);
+    state.raf = requestAnimationFrame(tick);
+  }, { signal: state.abort.signal });
+  audio.addEventListener("pause", stop, { signal: state.abort.signal });
+  state.playButton.addEventListener("click", (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    if (state.duration <= 0) return;
+    if (!audio.paused) { audio.pause(); return; }
+    const win = currentWindow(state);
+    if (audio.currentTime < win.start || audio.currentTime >= win.keepEnd - END_EPSILON) audio.currentTime = win.start;
+    audio.play().catch(() => stop());
+  });
+  state.stopPlayer = () => { audio.pause(); stop(); };
+}
+
+function commitTimeInput(state, edge, input) {
+  if (state.duration <= 0) return;
+  const seconds = parseTimecode(input.value);
+  const win = currentWindow(state);
+  if (seconds === null) {
+    input.value = formatTimecode(edge === "start" ? win.start : win.end);
+    return;
+  }
+  writeTrim(state, dragTrimHandle(state.duration, { start: win.start, end: win.end }, edge, seconds / state.duration, MIN_TRIM_SECONDS));
+  notifyAusbossChange();
+  input.blur();
+}
+
+function watchWidget(state, widget) {
+  if (!widget || widget.__ausbossAudioWatch) return;
+  widget.__ausbossAudioWatch = true;
+  const prior = widget.callback;
+  widget.callback = function (...args) {
+    const result = prior?.apply(this, args);
+    if (!state.writing) updateFace(state);
+    return result;
+  };
+}
+
+function buildPanel(node) {
+  if (node.__ausbossLoadAudio) return node.__ausbossLoadAudio;
+  const audioWidget = findWidget(node, "audio");
+  const startWidget = findWidget(node, "start_seconds");
+  const endWidget = findWidget(node, "end_seconds");
+  if (!audioWidget || !startWidget || !endWidget) return null;
+  ensureAudioCss();
+  hideCoreAudio(node);
+  hideCanvasWidget(startWidget);
+  hideCanvasWidget(endWidget);
+
+  const root = document.createElement("div");
+  root.className = "ausboss-video-root ausboss-audio-root";
+  const stage = document.createElement("div");
+  stage.className = "ausboss-video-stage is-empty";
+  stage.title = "Drag a handle to set where the sound starts or stops. Drag the middle to slide it.";
+  const canvas = document.createElement("canvas");
+  canvas.className = "ausboss-audio-wave";
+  const status = document.createElement("div");
+  status.className = "ausboss-video-status";
+  status.textContent = "Choose a sound file";
+  const playButton = makeToolButton("▶", "Play the part that comes out");
+  playButton.classList.add("ausboss-audio-play");
+  const loopButton = makeToolButton("LOOP", "Play it again and again");
+  stage.append(canvas, status);
+
+  const values = document.createElement("div");
+  values.className = "ausboss-video-values";
+  const makeValue = (labelText, title) => {
+    const wrap = document.createElement("div");
+    wrap.className = "ausboss-video-value";
+    const label = document.createElement("label");
+    label.textContent = labelText;
+    const input = document.createElement("input");
+    input.type = "text";
+    input.inputMode = "decimal";
+    input.placeholder = "m:ss.s";
+    input.title = title;
+    input.addEventListener("keydown", (event) => {
+      keepKeyInField(event);
+      if (event.key === "Enter") input.dispatchEvent(new Event("change"));
+    });
+    wrap.append(label, input);
+    return { wrap, input };
+  };
+  const startValue = makeValue("IN", "Where the sound starts. Type seconds (12.5) or a time (0:12.5).");
+  const endValue = makeValue("OUT", "Where the sound stops. Type seconds (24) or a time (0:24.0).");
+  // How long the output is, beside OUT and off the wave. Red when Max
+  // length cuts the pick short; the tooltip says how much.
+  const summary = document.createElement("div");
+  summary.className = "ausboss-audio-length";
+  values.append(startValue.wrap, endValue.wrap);
+  const row = document.createElement("div");
+  row.className = "ausboss-audio-row";
+  row.append(playButton, values, summary, loopButton);
+  root.append(stage, row);
+
+  const widget = node.addDOMWidget(PANEL_WIDGET, "ausboss_audio", root, {
+    serialize: false,
+    hideOnZoom: false,
+    getMinHeight: () => PANEL_MIN_HEIGHT + WIDGET_FRAME,
+  });
+  keepDomWidgetWidthAuto(widget);
+  widget.serialize = false;
+  fillNodeHeight(widget, {
+    minWidth: MIN_WIDTH,
+    minHeight: PANEL_MIN_HEIGHT + WIDGET_FRAME,
+    minNodeSize: [MIN_WIDTH, 200],
+    exactMinWidth: true,
+  });
+
+  const audio = new Audio();
+  audio.preload = "auto";
+  const abort = new AbortController();
+  const state = node.__ausbossLoadAudio = {
+    node, root, stage, canvas, status, playButton, loopButton, summary, audio,
+    startInput: startValue.input, endInput: endValue.input,
+    audioWidget, startWidget, endWidget, maxWidget: findWidget(node, "max_seconds"),
+    duration: 0, peaks: null, abort, writing: false, dragging: false, raf: 0, loading: 0,
+  };
+
+  // Clicking the red length moves OUT to where the sound really ends.
+  summary.addEventListener("click", (event) => {
+    const win = currentWindow(state);
+    if (win.cut <= 0.005) return;
+    event.preventDefault();
+    event.stopPropagation();
+    writeTrim(state, { start: win.start, end: win.keepEnd });
+    notifyAusbossChange();
+  });
+
+  const updateLoop = () => loopButton.classList.toggle("active", loopEnabled(node));
+  updateLoop();
+  loopButton.addEventListener("click", (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    node.properties.ausboss_load_audio_loop = !loopEnabled(node);
+    updateLoop();
+    notifyAusbossChange();
+  });
+
+  const refresh = async () => {
+    state.stopPlayer?.();
+    const name = audioWidget.value;
+    const ticket = ++state.loading;
+    state.duration = 0;
+    state.peaks = null;
+    if (!name || typeof name !== "string") {
+      audio.removeAttribute("src");
+      stage.classList.add("is-empty");
+      status.textContent = "Choose a sound file";
+      updateFace(state);
+      return;
+    }
+    const parts = splitMediaName(name);
+    stage.classList.add("is-empty");
+    status.textContent = `Loading ${parts.filename}…`;
+    const type = parseImageReference(name)?.type ?? "input";
+    const route = `/view?${mediaViewQuery({ ...parts, type }, "input")}`;
+    audio.src = api.apiURL(route);
+    try {
+      const result = await loadPeaks(name, route);
+      if (ticket !== state.loading) return;
+      state.duration = result.duration;
+      state.peaks = result.peaks;
+      stage.classList.remove("is-empty");
+      updateFace(state);
+    } catch (error) {
+      if (ticket !== state.loading) return;
+      const info = document.createElement("button");
+      info.type = "button";
+      info.className = "ausboss-audio-error";
+      info.textContent = "Audio preview unavailable ⓘ";
+      info.title = String(error?.message || error);
+      info.setAttribute("aria-label", "Audio preview unavailable. Show details.");
+      info.onclick = event => {
+        event.stopPropagation();
+        showToast({ summary: "Audio preview unavailable", detail: info.title });
+      };
+      status.replaceChildren(info);
+    }
+  };
+  state.refresh = refresh;
+
+  installDrag(state);
+  installPlayer(state);
+  watchWidget(state, startWidget);
+  watchWidget(state, endWidget);
+  watchWidget(state, state.maxWidget);
+  startValue.input.addEventListener("change", () => commitTimeInput(state, "start", startValue.input));
+  endValue.input.addEventListener("change", () => commitTimeInput(state, "end", endValue.input));
+  const observer = new ResizeObserver(() => draw(state));
+  observer.observe(stage);
+  state.observer = observer;
+
+  const priorAudioCallback = audioWidget.callback;
+  audioWidget.callback = function (...args) {
+    const result = priorAudioCallback?.apply(this, args);
+    peakCache.delete(audioWidget.value);
+    refresh();
+    return result;
+  };
+  setTimeout(refresh, 0);
+  return state;
+}
+
+app.registerExtension({
+  name: "ausboss.load_audio",
+  beforeRegisterNodeDef(nodeType, nodeData) {
+    if (nodeData?.name !== NODE_NAME) return;
+    // The frontend's Upload button for an audio_upload input looks for its
+    // player widget and fails without one, and it adds that player only to
+    // its own audio nodes. Ask for it here, ahead of the button; the panel
+    // hides it, since the wave plays the sound instead.
+    const required = nodeData.input?.required;
+    if (required && !required.audioUI) {
+      const entries = Object.entries(required);
+      const at = entries.findIndex(([name]) => name === "audio") + 1;
+      entries.splice(at, 0, ["audioUI", ["AUDIO_UI", {}]]);
+      nodeData.input.required = Object.fromEntries(entries);
+    }
+    chainCallback(nodeType.prototype, "onNodeCreated", function () {
+      buildPanel(this);
+      // Only for a genuinely new node: onConfigure restores a saved size
+      // after this runs, so a workflow's own size still wins.
+      const floor = Number(this.computeSize?.()?.[1]) || 0;
+      if (floor > 0) this.setSize?.([DEFAULT_WIDTH, floor + DEFAULT_WAVE_EXTRA]);
+    });
+    chainCallback(nodeType.prototype, "onConfigure", function () {
+      queueMicrotask(() => {
+        const state = buildPanel(this);
+        if (state) {
+          hideCoreAudio(this);
+          state.refresh?.();
+        }
+      });
+    });
+    // A wire into Max length changes what comes out; redraw when one comes or goes.
+    chainCallback(nodeType.prototype, "onConnectionsChange", function () {
+      const state = this.__ausbossLoadAudio;
+      if (state) queueMicrotask(() => updateFace(state));
+    });
+    chainCallback(nodeType.prototype, "onRemoved", function () {
+      const state = this.__ausbossLoadAudio;
+      state?.stopPlayer?.();
+      state?.abort?.abort();
+      state?.observer?.disconnect();
+      if (state) state.audio.removeAttribute("src");
+      this.__ausbossLoadAudio = null;
+    });
+  },
+});

js/load_image_pad/index.js

@@ -1,5 +1,5 @@
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { isForeignRun } from "../shared/prompt_scope.mjs";
 import { BRAND, chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange } from "../shared/index.mjs";
 import { fillNodeHeight } from "../shared/panel_layout.mjs";

js/load_video/index.js

@@ -1,5 +1,5 @@
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange } from "../shared/index.mjs";
 import { keepKeyInField } from "../shared/canvas_passthrough.mjs";
 import { WIDGET_FRAME, fillNodeHeight } from "../shared/panel_layout.mjs";

js/lora_loader/index.js

@@ -1,5 +1,5 @@
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { BRAND, chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange, showToast } from "../shared/index.mjs";
 import { WIDGET_FRAME, fillNodeHeight, holdVueNodeMinWidth } from "../shared/panel_layout.mjs";
 import { hideInputsInDef, hideWidget as collapseWidget } from "../shared/widget_visibility.mjs";
@@ -20,7 +20,6 @@ import {
   BYPASS_MODE,
   DEFAULT_STEP,
   FINE_STEP,
-  MAX_ROWS,
   MUTE_MODE,
   STRENGTH_MAX,
   STRENGTH_MIN,
@@ -1078,10 +1077,6 @@ function openPicker(state, index, anchor, { keyboard = false } = {}) {
     const { name, kind } = entry;
     if (kind === "folder") {
       const result = appendFolderRows(state.rows, folders.get(name) ?? [], state.settings?.default_strength ?? 1);
-      if (result.needed > result.room) {
-        loraToast(`This folder has ${result.needed} new LoRAs, but only ${result.room} of ${MAX_ROWS} rows are free. Nothing was added. Remove rows or choose a smaller folder.`);
-        return;
-      }
       if (!result.added) {
         loraToast("Every LoRA in this folder is already in this stack. Nothing was added.");
         return;
@@ -1095,10 +1090,6 @@ function openPicker(state, index, anchor, { keyboard = false } = {}) {
       if (!pointer) backToStack(firstAdded);
       return;
     }
-    if (adding && state.rows.length >= MAX_ROWS) {
-      loraToast(`This stack already has ${MAX_ROWS} rows. Remove a row before adding another LoRA.`);
-      return;
-    }
     closePopup();
     const strength = roundStrength(state.settings?.default_strength ?? 1);
     const rows = adding
@@ -1114,10 +1105,6 @@ function openPicker(state, index, anchor, { keyboard = false } = {}) {
 
   const addTicked = ({ pointer = false } = {}) => {
     const result = appendFolderRows(state.rows, ticked, state.settings?.default_strength ?? 1);
-    if (result.needed > result.room) {
-      loraToast(`You ticked ${result.needed} new LoRAs, but only ${result.room} of ${MAX_ROWS} rows are free. Nothing was added. Untick some or remove rows.`);
-      return;
-    }
     if (!result.added) {
       loraToast("Every ticked LoRA is already in this stack. Nothing was added.");
       return;
@@ -1769,7 +1756,6 @@ function openRowMenu(state, index, event) {
   }
   menu.append(el("div", "ausboss-lora-menu-rule"));
   const insertEmpty = (position) => {
-    if (state.rows.length >= MAX_ROWS) return;
     const strength = roundStrength(state.settings?.default_strength ?? 1);
     const rows = state.rows.slice();
     // A row added next to a grouped one joins its group.
@@ -1779,8 +1765,8 @@ function openRowMenu(state, index, event) {
     commitRows(state, rows, { structural: true });
     fitNode(state);
   };
-  item("Insert empty LoRA above", () => insertEmpty(index), state.rows.length >= MAX_ROWS);
-  item("Insert empty LoRA below", () => insertEmpty(index + 1), state.rows.length >= MAX_ROWS);
+  item("Insert empty LoRA above", () => insertEmpty(index));
+  item("Insert empty LoRA below", () => insertEmpty(index + 1));
   item("Move up", () => commitGroups(state, moveRowInStack(state.rows, index, -1)),
     index === 0 && !row.group);
   item("Move down", () => commitGroups(state, moveRowInStack(state.rows, index, 1)),
@@ -1791,7 +1777,7 @@ function openRowMenu(state, index, event) {
     rows.splice(index + 1, 0, copy);
     commitRows(state, rows, { structural: true });
     fitNode(state);
-  }, state.rows.length >= MAX_ROWS);
+  });
   item(count > 1 ? `Remove these ${count} LoRAs` : "Remove this LoRA", () => {
     commitGroups(state, state.rows.filter((entry) => !ids.includes(entry.id)));
   }).classList.add("ausboss-lora-danger");
@@ -1804,7 +1790,7 @@ function openStackMenu(state, event) {
   const menu = el("div", "ausboss-lora-menu");
   const item = (label, action, disabled = false) => menuItem(menu, label, action, disabled);
   const add = state.panel.querySelector(".ausboss-lora-add, .ausboss-lora-blank");
-  item("+ Add LoRAs…", () => openPicker(state, null, add), !add || state.rows.length >= MAX_ROWS);
+  item("+ Add LoRAs…", () => openPicker(state, null, add), !add);
   const ids = state.rows.filter((row) => selectedIds(state).has(row.id)).map((row) => row.id);
   if (ids.length) {
     item(ids.length > 1 ? `Group the ${ids.length} selected LoRAs` : "Group the selected LoRA", () => {
@@ -2489,11 +2475,6 @@ async function runImportChain(state) {
     { position: "before", deduplicate: false });
   const downMerge = mergeImportedRows(upMerge.rows, downResolved,
     { position: "after", deduplicate: false });
-  // Never bypass a source if any of its rows would be lost to the stack limit.
-  if (state.rows.length + upMerge.added + downMerge.added > MAX_ROWS) {
-    loraToast(`Absorb needs more than ${MAX_ROWS} rows. Free some stack rows first; source loaders remain active.`);
-    return;
-  }
   // Rows that patch model and CLIP differently need both boxes visible, or
   // the difference is invisible and lost on the first scrub. The flip is
   // node-local (unified stays the default for new nodes) and the toast
@@ -2670,7 +2651,6 @@ function installStackKeyboard(state) {
     if (action.kind === "focus") {
       focusStackRow(state, visibleRowIndex(state, index, action.index));
     } else if (action.kind === "pick") {
-      if (atAdd && state.rows.length >= MAX_ROWS) return;
       openPicker(state, atAdd ? null : index,
         atAdd ? state.panel.querySelector(".ausboss-lora-add") : rowElement.querySelector(".ausboss-lora-name"),
         { keyboard: true });
@@ -2708,7 +2688,6 @@ function renderRows(state) {
   panel.append(body);
 
   const addRowAndPick = (event) => {
-    if (state.rows.length >= MAX_ROWS) return;
     // detail is 0 for a click made with Enter or Space.
     openPicker(state, null, event.currentTarget, { keyboard: event.detail === 0 });
   };
@@ -2936,7 +2915,6 @@ function renderRows(state) {
   const actions = el("div", "ausboss-lora-actions");
   const add = el("button", "ausboss-lora-add", "+ LoRA");
   add.type = "button";
-  add.disabled = state.rows.length >= MAX_ROWS;
   add.addEventListener("click", addRowAndPick);
   add.title = "Pick one LoRA, or click a folder name to add all its LoRAs.";
   actions.append(add);

js/mask_by_touch/index.js

@@ -4,8 +4,8 @@
 // node, runs the node alone when the face asks for the picture or for what
 // SAM 3 finds at a click, and hands it what a run sent back.
 
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { chainCallback } from "../shared/index.mjs";
 import { executionIdOf, isSwitchedOff, nodeByExecutionId } from "../shared/graph_ids.mjs";
 import { outputLocatorId } from "../shared/input_preview.mjs";
@@ -168,13 +168,18 @@ api.addEventListener("execution_error", ({ detail }) => {
 api.addEventListener("execution_interrupted", () => settleAll());
 // A look is one long, quiet run. The node sends what it has found every
 // second or two, so things light up while it is still looking.
+// A run that stops at the node (nothing picked on this picture) sends the
+// picture that came in first, so a picture that changed upstream shows at
+// once. It is shown like a kept note: it starts no run of its own.
 api.addEventListener(LOOK_EVENT, ({ detail }) => {
   try {
     if (!faces.size || !detail?.note) return;
     const id = String(detail.node ?? "");
     const root = app.rootGraph ?? app.graph;
     for (const face of faces) {
-      if (face.alive && face.inFlight && executionIdOf(root, face.node) === id) face.takeNote(detail.note, { interim: true });
+      if (!face.alive || executionIdOf(root, face.node) !== id) continue;
+      if (detail.stopped) face.takeNote(detail.note, { restored: true });
+      else if (face.inFlight) face.takeNote(detail.note, { interim: true });
     }
   } catch {
     // Never in the way of a run.

js/notify/index.js

@@ -5,8 +5,8 @@
 // setting turns it on. The chime is built once as a small WAV in memory
 // and played through an ordinary audio element, so the pack ships no sound
 // file and nothing is built until the first chime plays.
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { showToast } from "../shared/index.mjs";
 import { noticesFromExecuted, queueRemaining, shouldChime } from "../shared/notify.mjs";
 import { chimeSamples, wavBytes } from "./chime.mjs";

js/prompt_scope/index.js

@@ -17,8 +17,8 @@
 // It also notes the runs a node starts for itself (Mask by Touch looking at
 // its picture), so the Run Timer and the runtime badges can leave them out.
 
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { isAusbossNode } from "../shared/index.mjs";
 import { nodeByExecutionId } from "../shared/graph_ids.mjs";
 import { isNodeOwnRun, outputKey, ownRuns, runScope } from "../shared/prompt_scope.mjs";

js/recreate/index.js

@@ -7,7 +7,7 @@
 // position/size/title/colors/flags/mode/properties survive. Slots or
 // widgets that no longer exist are skipped silently. Any failure rolls
 // the graph back and keeps the original node.
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import { linkSlots, restoreOutputLinks, snapshotLinks } from "../shared/graph_links.mjs";
 import { isAusbossNode } from "../shared/index.mjs";
 

js/replace_missing/index.js

@@ -8,7 +8,7 @@
 // node, carry translated widgets, remap links, and roll back on failure.
 // This is purely a graph rewrite; no third-party class name is ever
 // registered on the backend.
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import { linkSlots, restoreOutputLinks, snapshotLinks } from "../shared/graph_links.mjs";
 import { BRAND, notifyAusbossChange, showToast } from "../shared/index.mjs";
 import {

js/resolution/index.js

@@ -21,7 +21,8 @@
 // at the selected pixel budget and follow the explicit orientation toggle. Snap governs gestures only — typed
 // values are never re-snapped.
 
-import { app } from "/scripts/app.js";
+import { CAPTION_TYPE, HINT_TYPE, compactAction } from "../shared/panel_controls.mjs";
+import { app } from "../../../scripts/app.js";
 import {
   chainCallback,
   keepDomWidgetWidthAuto,
@@ -29,8 +30,10 @@ import {
 } from "../shared/index.mjs";
 import { WIDGET_FRAME, fillNodeHeight, holdVueNodeMinWidth } from "../shared/panel_layout.mjs";
 import { hideInputsInDef, hideWidget } from "../shared/widget_visibility.mjs";
+import { liftSlot, markSocketless } from "../shared/widget_card_math.mjs";
 import { makeScrubInput } from "../shared/scrub_input.mjs";
 import {
+  closeSettingsMenu,
   gearIconSvg,
   loadSettings,
   openSettingsMenu,
@@ -51,12 +54,16 @@ import {
   offGrid,
   orientRatio,
   parseRail,
+  parseWorkflowSizes,
+  readWorkflowPolicy,
+  savedWorkflowPolicy,
+  workflowRatios,
   quickSizes,
   ratioLabel,
   reduceRatio,
   scrubDim,
   sizeForMegapixels,
-  stageScale,
+  fitStage,
 } from "../shared/resolution_math.mjs";
 
 const NODE_CLASS = "AUSBOSS_NODES_Resolution";
@@ -132,13 +139,19 @@ function installStyles() {
   .ausboss-res-panel { display: flex; flex-direction: column; gap: ${SECTION_GAP}px;
     width: 100%; height: 100%; padding: ${PANEL_PADDING}px; overflow: hidden;
     font: 400 11px ${MONO}; color: #d7dde2; }
+  .ausboss-size-dialog{color-scheme:dark;width:min(365px,88vw);border:1px solid #345554;border-radius:10px;background:#162022;color:#d7e4e3;padding:18px;font:13px system-ui}
+  .ausboss-size-dialog::backdrop{background:#0008}
+  .ausboss-size-dialog textarea{display:block;box-sizing:border-box;width:100%;margin:8px 0;padding:8px;font:13px monospace}
+  .ausboss-size-dialog input{accent-color:#00b4aa}
+  .ausboss-size-dialog [role=alert]{color:#ffd49e}
+  .ausboss-size-dialog p{color:#adc1be;font:12px/1.45 system-ui;margin:7px 0 12px}
+  .ausboss-size-dialog footer{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
   .ausboss-res-sec { flex: none; background: #141515; border: 1px solid #252727;
     border-radius: 8px; padding: 6px 8px 8px; }
   .ausboss-res-sechead { display: flex; align-items: baseline;
     justify-content: space-between; margin-bottom: 6px; gap: 8px; }
-  .ausboss-res-sechead .label { font: 500 9px ${MONO}; letter-spacing: .14em;
-    text-transform: uppercase; color: #6a7070; white-space: nowrap; }
-  .ausboss-res-sechead .hint { font: 400 9px ${MONO}; color: #4e5454;
+  .ausboss-res-sechead .label { ${CAPTION_TYPE} white-space: nowrap; }
+  .ausboss-res-sechead .hint { ${HINT_TYPE}
     white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
   .ausboss-res-shaperow { display: flex; gap: 6px; align-items: stretch; }
   .ausboss-res-subbox { background: #101111; border: 1px solid #252727;
@@ -174,12 +187,12 @@ function installStyles() {
     background-image: radial-gradient(#242727 1px, transparent 1px);
     background-size: 22px 22px; background-position: center; opacity: .55; }
   .ausboss-res-rings { position: absolute; inset: 0; pointer-events: none; }
-  .ausboss-res-rect { position: absolute; inset: 0; margin: auto;
-    border: 1.5px solid #00b4aa; background: rgba(0,180,170,.05);
+  .ausboss-res-rect { position: absolute; inset: var(--ausboss-res-inset,0) 0 0; margin: auto;
+    border: 1.5px solid #00b4aa; background: rgba(0,180,170,.10);
     display: flex; flex-direction: column; align-items: center; justify-content: center;
     gap: 2px; }
   .ausboss-res-rect.easing { transition: width ${REFIT_MS}ms ease, height ${REFIT_MS}ms ease; }
-  .ausboss-res-ghost { position: absolute; inset: 0; margin: auto;
+  .ausboss-res-ghost { position: absolute; inset: var(--ausboss-res-inset,0) 0 0; margin: auto;
     border: 1px dashed #4d5555; pointer-events: none; display: none; }
   .ausboss-res-readout { position: absolute; top: 6px; left: 9px; right: 9px; z-index: 2;
     display: flex; align-items: center; justify-content: space-between; gap: 8px;
@@ -207,6 +220,8 @@ function installStyles() {
     height: ${CONTROL_H}px; background: #1c1e1e; border-color: #313434; font: 500 13px ${MONO}; }
   .ausboss-res-field .ausboss-scrub > .ausboss-scrub-input { text-align: left;
     padding-left: 8px; color: #eef1f1; }
+  .ausboss-res-field[inert] .ausboss-scrub,.ausboss-res-field .ausboss-scrub[inert]{border-color:transparent;background:transparent}
+  .ausboss-res-field[inert] .ausboss-scrub-step,.ausboss-res-field .ausboss-scrub[inert] .ausboss-scrub-step{display:none}
   .ausboss-res-field.linked { opacity: .5; pointer-events: none; }
   .ausboss-res-axis { flex: none; font: 400 9px ${MONO}; color: #565c5c; }
   .ausboss-res-btn { width: ${CONTROL_H}px; height: ${CONTROL_H}px; flex: none;
@@ -214,7 +229,7 @@ function installStyles() {
     border-radius: 5px; color: #9aa0a0; cursor: pointer; font-size: 12px; padding: 0; }
   .ausboss-res-btn:hover { border-color: #00b4aa; color: #00b4aa; }
   .ausboss-res-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px;
-    min-height: ${QUICK_H * 2 + 5}px; align-content: start; }
+    height: ${QUICK_H * 2 + 5}px; overflow-y: auto; align-content: start; }
   .ausboss-res-chip.customchip { opacity: .45; cursor: default;
     pointer-events: none; border-style: dashed; grid-column: span 2; }
   .ausboss-res-quick .ausboss-res-chip { height: ${QUICK_H}px; font-size: 9.5px;
@@ -256,6 +271,7 @@ function getSize(state) {
 }
 
 function commitSize(state, width, height, { gesture = false } = {}) {
+  if (state.strict && (!isListed(state, width, height) || axisLinked(state, "width") || axisLinked(state, "height"))) return;
   if (!axisLinked(state, "width")) state.widthWidget.value = clampDim(width);
   if (!axisLinked(state, "height")) state.heightWidget.value = clampDim(height);
   repaint(state);
@@ -350,7 +366,7 @@ function stageBox(state) {
 
 // Equal-cost curves, log-sampled across the plausible width range so they
 // sweep the whole quadrant (the design's rendering).
-function paintRings(state, scale) {
+function paintRings(state, scale, shift) {
   const svg = state.rings;
   svg.replaceChildren();
   const show = state.settings?.show_mp_rings !== false;
@@ -358,7 +374,7 @@ function paintRings(state, scale) {
   const box = stageBox(state);
   svg.setAttribute("viewBox", `0 0 ${box.w} ${box.h}`);
   const cx = box.w / 2;
-  const cy = box.h / 2;
+  const cy = box.h / 2 + shift;
   for (const mp of [0.5, 1, 2]) {
     const points = [];
     for (let i = 0; i <= 60; i += 1) {
@@ -396,7 +412,7 @@ function paintRings(state, scale) {
 
 // The quick list regenerates when the ratio or snap changes; repaint only
 // re-highlights it otherwise.
-function rebuildQuick(state, width, height, snap, custom) {
+function rebuildQuick(state, width, height, snap, custom, picks) {
   const wrap = state.quickWrap;
   wrap.replaceChildren();
   state.quickButtons = [];
@@ -409,7 +425,8 @@ function rebuildQuick(state, width, height, snap, custom) {
     wrap.append(chip);
     return;
   }
-  const list = quickSizes(width, height, snap);
+  const list = picks ?? quickSizes(width, height, snap);
+  if (state.strict && !list.length) return;
   if (!list.length) {
     wrap.append(el("span", "ausboss-res-noquick",
       "No on-grid sizes for this ratio at this snap — try a finer snap."));
@@ -420,6 +437,7 @@ function rebuildQuick(state, width, height, snap, custom) {
     chip.type = "button";
     chip.title = `Apply ${size.width}×${size.height} exactly.`;
     chip.addEventListener("click", () => {
+      if (picks && size.width !== size.height) state.node.properties.ausbossResolutionPortrait = size.height > size.width;
       commitSize(state, size.width, size.height);
       easeRefit(state);
     });
@@ -430,26 +448,98 @@ function rebuildQuick(state, width, height, snap, custom) {
   }
 }
 
+function isListed(state, width, height) {
+  return state.sizes.some(([w, h]) => w === width && h === height);
+}
+
+function restorePolicy(state) {
+  const widget = state.policyWidget;
+  if (!widget) return;
+  const legacy = state.node.properties?.ausbossWorkflowSizes;
+  widget.value = savedWorkflowPolicy(widget.value, legacy);
+  if (state.node.properties) delete state.node.properties.ausbossWorkflowSizes;
+  try {
+    Object.assign(state, readWorkflowPolicy(widget.value), { policyError: false });
+  } catch {
+    Object.assign(state, { sizes: [], strict: true, policyError: true });
+  }
+  const { width, height } = getSize(state);
+  if (state.strict && state.sizes.length && !isListed(state, width, height)
+      && !axisLinked(state, "width") && !axisLinked(state, "height")) {
+    [state.widthWidget.value, state.heightWidget.value] = state.sizes[0];
+  }
+}
+
+function editWorkflowSizes(state) {
+  closeSettingsMenu();
+  const dialog = el("dialog", "ausboss-size-dialog");
+  dialog.setAttribute("aria-label", "Workflow resolutions");
+  const label = el("label", "", "Workflow resolutions");
+  const area = el("textarea");
+  area.rows = 6;
+  area.placeholder = "576 × 1024";
+  area.value = state.sizes.map(pair => pair.join(" × ")).join("\n");
+  label.append(area);
+  const hint = el("p", "", "One width × height per line. These quick picks are saved with this node.");
+  const lock = el("label");
+  const checkbox = el("input");
+  checkbox.type = "checkbox";
+  checkbox.checked = state.strict;
+  lock.append(checkbox, " Limit choices to this list");
+  const description = el("p", "", "Only listed sizes and their exact aspect ratios can be selected. Linked dimensions are checked when the workflow runs.");
+  const error = el("div");
+  error.setAttribute("role", "alert");
+  const footer = el("footer");
+  const cancel = compactAction("Cancel");
+  const save = compactAction("Save sizes");
+  cancel.onclick = () => dialog.close();
+  save.onclick = () => {
+    let sizes;
+    try {
+      sizes = parseWorkflowSizes(area.value);
+      if (checkbox.checked && !sizes.length) throw new Error("Add a resolution, or turn off the limit to allow any size.");
+    } catch (e) {
+      error.textContent = e.message;
+      area.focus();
+      return;
+    }
+    state.policyWidget.value = sizes.length ? JSON.stringify({ strict: checkbox.checked, sizes }) : "";
+    restorePolicy(state);
+    buildPanel(state);
+    fitNode(state);
+    notifyAusbossChange();
+    dialog.close();
+  };
+  footer.append(cancel, save);
+  dialog.append(label, hint, lock, description, error, footer);
+  document.body.append(dialog);
+  dialog.addEventListener("close", () => dialog.remove(), { once:true });
+  dialog.showModal();
+}
+
 function repaint(state) {
   const { width, height } = getSize(state);
   const snap = currentSnap(state);
-  const box = stageBox(state);
-  const scale = state.frozenScale ?? stageScale(width, height, box.w, box.h);
   const portrait = orientation(state);
   const ratio = reduceRatio(width, height);
 
-  state.rect.style.width = `${Math.max(8, width * scale)}px`;
-  state.rect.style.height = `${Math.max(8, height * scale)}px`;
   state.dimLabel.textContent = `${width} × ${height}`;
   state.subMp.textContent = `${megapixels(width, height).toFixed(2)} MP`;
-  state.subRatio.textContent = ratioLabel(width, height);
-  state.offGridDot.style.display = offGrid(width, height, snap) ? "" : "none";
+  state.subRatio.textContent = state.strict ? `${ratio.x}:${ratio.y}` : ratioLabel(width, height);
+  state.offGridDot.style.display = !state.strict && offGrid(width, height, snap) ? "" : "none";
   state.dots.style.display = state.settings?.show_grid === false ? "none" : "";
 
-  paintRings(state, scale);
+  const box = stageBox(state);
+  const sideRoom = 14 + Math.max(state.dimLabel.offsetWidth, state.subMp.parentElement.offsetWidth);
+  const frame = state.frame = state.frozenFrame ?? fitStage(width, height, box.w, box.h, sideRoom);
+  const { scale, shift } = frame;
+  state.stage.style.setProperty("--ausboss-res-inset", `${2 * shift}px`);
+  state.rect.style.width = `${Math.max(8, width * scale)}px`;
+  state.rect.style.height = `${Math.max(8, height * scale)}px`;
+  paintRings(state, scale, shift);
 
   // Section labels.
-  state.orientLabel.textContent = width === height
+  state.orientLabel.textContent = state.strict ? "Workflow ratios" : width === height
     ? `square · chips ${portrait ? "portrait" : "landscape"}`
     : portrait ? "portrait" : "landscape";
   const flipFit = portrait ? { w: 11, h: 15 } : { w: 15, h: 11 };
@@ -463,14 +553,17 @@ function repaint(state) {
 
   // Ratio chips render in the selected orientation; filled = exact, dashed = near.
   state.chipButtons.forEach(({ button, ratio: chipRatio, glyph, label }) => {
-    const oriented = orientRatio(chipRatio, portrait);
+    const oriented = state.strict ? chipRatio : orientRatio(chipRatio, portrait);
     const fitted = fitRectInBox(oriented.x, oriented.y, 14, 14);
     glyph.style.width = `${fitted.w.toFixed(1)}px`;
     glyph.style.height = `${fitted.h.toFixed(1)}px`;
     label.textContent = oriented.label;
-    button.title = `${oriented.label}: reshape to this ratio. The flip button on the left sets the orientation.`;
+    button.title = state.strict ? `Show approved ${oriented.label} sizes` : `${oriented.label}: reshape to this ratio. The flip button on the left sets the orientation.`;
     const candidate = chipMatch(width, height, oriented);
-    const match = candidate?.flipped ? null : candidate;
+    const match = state.strict
+      ? (ratio.x === chipRatio.x && ratio.y === chipRatio.y ? { state: "exact" } : null)
+      : candidate?.flipped ? null : candidate;
+    button.setAttribute("aria-pressed", String(match?.state === "exact"));
     button.classList.toggle("exact", match?.state === "exact");
     button.classList.toggle("near", match?.state === "near");
   });
@@ -479,49 +572,52 @@ function repaint(state) {
   const widthLinked = axisLinked(state, "width");
   const heightLinked = axisLinked(state, "height");
   const linked = widthLinked || heightLinked;
-  state.flipButton.disabled = linked;
-  state.swapButton.disabled = linked;
-  state.budgetControl.root.style.pointerEvents = linked ? "none" : "";
-  state.budgetControl.root.style.opacity = linked ? ".5" : "";
+  state.flipButton.disabled = linked || state.strict;
+  state.swapButton.disabled = linked || (state.strict && (width === height || !isListed(state, height, width)));
+  state.budgetControl.root.inert = linked || state.strict;
+  state.budgetControl.root.style.opacity = linked || state.strict ? ".65" : "";
   for (const { button } of state.chipButtons) button.disabled = linked;
   state.widthControl.set(width);
   state.heightControl.set(height);
-  state.budgetControl?.set(megapixels(width, height));
-  state.widthField.classList.toggle("linked", widthLinked);
-  state.heightField.classList.toggle("linked", heightLinked);
-  state.widthField.title = widthLinked ? "Width is driven by its input link." : "";
-  state.heightField.title = heightLinked ? "Height is driven by its input link." : "";
+  state.budgetControl.set(megapixels(width, height));
+  for (const [field, wired] of [[state.widthField, widthLinked], [state.heightField, heightLinked]]) {
+    field.inert = wired || state.strict;
+    field.classList.toggle("linked", wired);
+  }
   state.handles.e.classList.toggle("linked", widthLinked);
   state.handles.s.classList.toggle("linked", heightLinked);
-  state.handles.se.classList.toggle("linked", widthLinked || heightLinked);
+  state.handles.se.classList.toggle("linked", linked);
 
-  // Quick sizes follow the CURRENT ratio - the Pixaroma behavior, but the
-  // list is generated on-ratio/on-grid instead of hand-curated. Frozen
+  // Quick sizes follow the current ratio and snap grid. Frozen
   // while a gesture is live (a drag sweeps ratios; regenerating per move
   // read as glitching), and a shape off the rail shows one "custom" chip.
   if (!state.dragging) {
     const onRail = state.railRatios?.some(
       (railRatio) => chipMatch(width, height, railRatio)?.state === "exact",
     );
-    const quickKey = onRail ? `${ratio.x}:${ratio.y}/${snap}` : `custom/${snap}`;
+    const group = state.strict && state.railRatios.find(r => r.x === ratio.x && r.y === ratio.y);
+    const picks = state.strict ? (group?.sizes ?? []) : state.sizes.length
+      ? state.sizes.map(([w, h]) => ({ width: w, height: h })) : null;
+    const quickKey = picks ? JSON.stringify(picks) : onRail ? `${ratio.x}:${ratio.y}/${snap}` : `custom/${snap}`;
     if (state.quickKey !== quickKey) {
       state.quickKey = quickKey;
-      rebuildQuick(state, width, height, snap, !onRail);
-      state.quickHint.textContent = onRail
-        ? `for ${ratioLabel(width, height)} · /${snap}`
-        : `custom · /${snap}`;
+      rebuildQuick(state, width, height, snap, !picks && !onRail, picks);
     }
+    state.quickHint.textContent = state.policyError ? "Invalid list · edit in settings"
+      : linked && state.strict ? "Linked size checked at run"
+      : state.strict ? `Allowed · ${ratio.x}:${ratio.y}` : picks ? "Workflow recommendations"
+      : onRail ? `for ${ratioLabel(width, height)} · /${snap}` : `custom · /${snap}`;
   }
   state.quickButtons.forEach(({ button, size }) => {
-    button.disabled = widthLinked || heightLinked;
-    button.classList.toggle("exact", size.width === width && size.height === height);
+    button.disabled = linked;
+    const selected = size.width === width && size.height === height;
+    button.classList.toggle("exact", selected);
+    button.setAttribute("aria-pressed", String(selected));
   });
 }
 
 function showGhost(state, width, height) {
-  const box = stageBox(state);
-  const { width: w, height: h } = getSize(state);
-  const scale = stageScale(w, h, box.w, box.h);
+  const { scale } = state.frame;
   state.ghost.style.width = `${width * scale}px`;
   state.ghost.style.height = `${height * scale}px`;
   state.ghost.style.display = "";
@@ -532,7 +628,7 @@ function hideGhost(state) {
 }
 
 function easeRefit(state) {
-  state.frozenScale = null;
+  state.frozenFrame = null;
   state.rect.classList.add("easing");
   repaint(state);
   clearTimeout(state.easeTimer);
@@ -542,15 +638,14 @@ function easeRefit(state) {
 // ---------- gestures ----------
 
 function beginHandleDrag(state, handle, event) {
-  if (event.button !== 0 || state.disposed) return;
+  if (state.strict || event.button !== 0 || state.disposed) return;
   if ((handle !== "s" && axisLinked(state, "width")) || (handle !== "e" && axisLinked(state, "height"))) return;
   event.preventDefault();
   event.stopPropagation();
   const start = getSize(state);
-  const box = stageBox(state);
   // Frozen at pointerdown: the rect may overflow the stage mid-gesture and
   // re-fits with a short ease on release - auto-fit never squirms mid-drag.
-  state.frozenScale = stageScale(start.width, start.height, box.w, box.h);
+  state.frozenFrame = state.frame;
   state.dragging = true;
   const origin = { x: event.clientX, y: event.clientY };
   state.dragAbort?.abort();
@@ -563,7 +658,7 @@ function beginHandleDrag(state, handle, event) {
       startHeight: start.height,
       dx: (moveEvent.clientX - origin.x) / zoom,
       dy: (moveEvent.clientY - origin.y) / zoom,
-      scale: state.frozenScale,
+      scale: state.frozenFrame.scale,
       snap: currentSnap(state),
       snapOn: !moveEvent.altKey,
       // The corner scales at the exact locked ratio; Shift frees both axes.
@@ -644,7 +739,7 @@ function sectionHead(label, hint) {
 function buildPanel(state) {
   state.dragAbort?.abort();
   state.dragging = false;
-  state.frozenScale = null;
+  state.frozenFrame = null;
   const panel = state.panel;
   panel.textContent = "";
   state.quickKey = null; // force the quick list to regenerate
@@ -668,19 +763,16 @@ function buildPanel(state) {
   state.flipButton = flip;
   state.flipGlyph = flipGlyph;
   state.chipButtons = [];
-  state.railRatios = parseRail(state.settings?.rail);
+  state.railRatios = state.strict ? workflowRatios(state.sizes) : parseRail(state.settings?.rail);
   for (const ratio of state.railRatios) {
     const chip = el("button", "ausboss-res-chip");
     chip.type = "button";
     const glyph = el("span", "glyph");
     const label = el("span");
     chip.append(glyph, label);
-    // A chip click lands on that ratio's canonical ~1MP default (the
-    // Pixaroma behavior, derived instead of table-driven); the gear's
-    // "keep current budget" toggle restores the budget-preserving mode.
-    // Chips only pick the shape; orientation belongs to the flip button.
     const chipTarget = () => {
       const size = getSize(state);
+      if (state.strict) return ratio.sizes.find(s => s.width === size.width && s.height === size.height) ?? ratio.sizes[0];
       const portrait = orientation(state);
       if (state.settings?.chips_keep_budget) {
         return applyRatioAtBudget(size.width, size.height, ratio, currentSnap(state), portrait);
@@ -701,13 +793,15 @@ function buildPanel(state) {
     state.chipButtons.push({ button: chip, ratio, glyph, label });
   }
   chipBox.append(chipGrid);
-  shapeRow.append(flipBox, chipBox);
+  if (!state.strict) shapeRow.append(flipBox);
+  shapeRow.append(chipBox);
   shapeSec.append(shapeRow);
   panel.append(shapeSec);
 
   // (2) STAGE
   const stage = el("div", "ausboss-res-stage");
-  stage.tabIndex = 0;
+  stage.tabIndex = state.strict ? -1 : 0;
+  if (state.strict) stage.title = "Choose from the workflow’s ratio and size buttons.";
   const dots = el("div", "ausboss-res-dots");
   const rings = svgEl("svg");
   rings.classList.add("ausboss-res-rings");
@@ -734,14 +828,14 @@ function buildPanel(state) {
         ? "Drag width - Alt unsnaps, Esc cancels"
         : "Drag height - Alt unsnaps, Esc cancels";
     grip.addEventListener("pointerdown", (event) => beginHandleDrag(state, handle, event));
-    rect.append(grip);
+    if (!state.strict) rect.append(grip);
     state.handles[handle] = grip;
   }
   stage.append(dots, rings, ghost, rect, readout);
   stage.addEventListener("keydown", (event) => {
     const keys = { ArrowLeft: [-1, 0], ArrowRight: [1, 0], ArrowUp: [0, 1], ArrowDown: [0, -1] };
     const move = keys[event.key];
-    if (!move) return;
+    if (!move || state.strict) return;
     event.preventDefault();
     event.stopPropagation();
     const step = event.shiftKey ? 8 : currentSnap(state);
@@ -803,10 +897,13 @@ function buildPanel(state) {
   gear.addEventListener("click", () => {
     openSettingsMenu({
       scope: SETTINGS_SCOPE,
-      schema: SETTINGS_SCHEMA.map((entry) => {
+      schema: [{ section: "This workflow" }, {
+        key: "workflow_sizes", type: "action", label: "Workflow resolutions", button: "Edit list",
+        onAction: () => editWorkflowSizes(state),
+      }, ...SETTINGS_SCHEMA.filter(e => !state.strict || !["default_snap", "chips_keep_budget", "rail"].includes(e.key)).map((entry) => {
         const input = entry.key === "latent" ? "latent" : entry.key === "batch" ? "batch_size" : null;
         return input && axisLinked(state, input) ? { section: `${entry.label} is linked` } : entry;
-      }),
+      })],
       anchor: gear.getBoundingClientRect(),
       title: "Latent Size settings",
       initial: {
@@ -869,7 +966,7 @@ function buildPanel(state) {
   state.resizeObserver?.disconnect();
   state.resizeObserver = new ResizeObserver(() => {
     holdVueNodeMinWidth(state.panel, MIN_WIDTH);
-    if (!state.frozenScale) repaint(state);
+    if (!state.frozenFrame) repaint(state);
   });
   state.resizeObserver.observe(stage);
 
@@ -907,6 +1004,8 @@ function installResolutionNode(node) {
   // the API format carries them like any other value.
   const latentWidget = node.widgets?.find((widget) => widget.name === "latent");
   const batchWidget = node.widgets?.find((widget) => widget.name === "batch_size");
+  const policyWidget = node.widgets?.find(widget => widget.name === "workflow_sizes");
+  hideWidget(policyWidget);
   if (latentWidget) hideWidget(latentWidget);
   if (batchWidget) hideWidget(batchWidget);
 
@@ -915,8 +1014,7 @@ function installResolutionNode(node) {
   const liftSockets = () => {
     for (const input of node.inputs ?? []) {
       if (["width", "height", "latent", "batch_size"].includes(input.widget?.name)) {
-        delete input.widget;
-        input._widget = undefined;
+        liftSlot(input);
       }
     }
   };
@@ -928,9 +1026,12 @@ function installResolutionNode(node) {
     heightWidget,
     latentWidget,
     batchWidget,
+    policyWidget,
+    sizes: [],
+    strict: false,
     panel,
     settings: loadSettings(SETTINGS_SCOPE, SETTINGS_SCHEMA),
-    frozenScale: null,
+    frozenFrame: null,
     quickKey: null,
   };
   node.__ausbossResolution = state;
@@ -953,6 +1054,7 @@ function installResolutionNode(node) {
     exactMinWidth: true,
   });
 
+  restorePolicy(state);
   buildPanel(state);
   for (const widget of [widthWidget, heightWidget, latentWidget, batchWidget]) {
     if (widget) chainCallback(widget, "callback", () => {
@@ -980,11 +1082,18 @@ function installResolutionNode(node) {
     // empty placeholder in their slots; put the defaults back.
     if (latentWidget && !["16ch", "4ch", "128ch"].includes(latentWidget.value)) latentWidget.value = "16ch";
     if (batchWidget && !(Number.isInteger(batchWidget.value) && batchWidget.value >= 1)) batchWidget.value = 1;
+    restorePolicy(state);
+    buildPanel(state);
     requestAnimationFrame(() => { if (!state.disposed) { syncPrimitiveLinks(state); repaint(state); } });
   });
   chainCallback(node, "onConnectionsChange", function () {
-    // Convert-to-input honesty: link changes flip the read-only axes.
-    requestAnimationFrame(() => { if (!state.disposed) { syncPrimitiveLinks(state); repaint(state); } });
+    requestAnimationFrame(() => {
+      if (state.disposed) return;
+      syncPrimitiveLinks(state);
+      // A removed Primitive can leave its last value in the backing widget.
+      if (state.strict) restorePolicy(state);
+      repaint(state);
+    });
   });
   chainCallback(node, "onRemoved", () => {
     state.disposed = true;
@@ -998,7 +1107,8 @@ app.registerExtension({
   name: "AusBoss.Resolution",
   beforeRegisterNodeDef(nodeType, nodeData) {
     if (nodeData?.name !== NODE_CLASS) return;
-    hideInputsInDef(nodeData, ["width", "height", "latent", "batch_size"]);
+    markSocketless(nodeData, ["workflow_sizes"]);
+    hideInputsInDef(nodeData, ["width", "height", "latent", "batch_size", "workflow_sizes"]);
     chainCallback(nodeType.prototype, "onNodeCreated", function () {
       installResolutionNode(this);
     });

js/run_check/index.js

@@ -19,8 +19,8 @@
 // check once per input the check reads, and collapseRepeatedErrors keeps
 // one per message on AusBoss nodes before the frontend shows them.
 
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { showToast } from "../shared/index.mjs";
 import { nodeByExecutionId } from "../shared/graph_ids.mjs";
 import {

js/run_timer/index.js

@@ -12,8 +12,8 @@
 // node.properties so a saved workflow reopens showing its author's time.
 // Decision logic lives in js/shared/run_timer.mjs under node:test.
 
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { BRAND, chainCallback, keepDomWidgetWidthAuto } from "../shared/index.mjs";
 import { holdNodeMinWidth } from "../shared/panel_layout.mjs";
 import { isOwnRun, ownRuns } from "../shared/prompt_scope.mjs";

js/save_image/index.js

@@ -8,8 +8,9 @@
 // When the `filename` input is linked the name comes from upstream: the
 // field shows {{filename}} and the tags fold away, since an exact name is
 // never decorated.
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { PANEL_LABELS } from "../shared/panel_controls.mjs";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { isForeignRun } from "../shared/prompt_scope.mjs";
 import { keepKeyInField } from "../shared/canvas_passthrough.mjs";
 import { BRAND, chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange } from "../shared/index.mjs";
@@ -145,7 +146,7 @@ async function openBrowse(state, anchor) {
     }
     path = listing.path;
     const use = el("button", "use", path ? `Use “${path}”` : "Use the output folder");
-    use.addEventListener("click", () => { setValue(state.node, "output_dir", path); state.refresh(); notifyAusbossChange(); closeBrowse(); });
+    use.addEventListener("click", () => { state.savedPath = null; setValue(state.node, "output_dir", path); state.refresh(); notifyAusbossChange(); closeBrowse(); });
     popup.append(use);
     if (path) {
       const up = el("button", "", "↑ up one level");
@@ -275,13 +276,13 @@ function buildCard(node) {
   embedSeg.setAttribute("role", "radiogroup");
   const embedButtons = new Map();
   const embedTitle = "Embed stores the prompt and workflow in the image for drag-back. Off writes a clean image for sharing or datasets.";
-  for (const [on, text] of [[false, "no"], [true, "yes"]]) {
+  for (const [on, text] of [[false, PANEL_LABELS.off], [true, PANEL_LABELS.on]]) {
     const button = el("button", "", text);
     button.type = "button"; button.title = embedTitle;
     button.addEventListener("click", () => { if (setValue(node, "save_metadata", on)) notifyAusbossChange(); state.refresh(); });
     embedSeg.append(button); embedButtons.set(on, button);
   }
-  embedRow.append(el("span", "ausboss-save-embed-label", "Embed workflow"), embedSeg);
+  embedRow.append(el("span", "ausboss-save-embed-label", PANEL_LABELS.embed), embedSeg);
   root.append(embedRow);
 
   root.addEventListener("pointerdown", (event) => {
@@ -369,7 +370,8 @@ function buildCard(node) {
   chainCallback(node, "onExecuted", (output) => {
     if (isForeignRun()) return;
     const saved = output?.ausboss_saved_path?.[0];
-    if (typeof saved === "string" && saved) { state.savedPath = saved; state.refresh(); }
+    state.savedPath = typeof saved === "string" && saved ? saved : null;
+    state.refresh();
   });
   chainCallback(node, "onRemoved", () => { state.alive = false; closeBrowse(); });
   state.refresh();

js/save_video/index.js

@@ -1,5 +1,6 @@
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { panelSwitch } from "../shared/panel_controls.mjs";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { isForeignRun, outputKey } from "../shared/prompt_scope.mjs";
 import { chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange } from "../shared/index.mjs";
 import { installNameTokens } from "../shared/name_tokens.mjs";
@@ -21,7 +22,7 @@ import {
 
 const NODE_NAME = "AUSBOSS_NODES_SaveVideo";
 const PREVIEW_WIDGET = "ausboss_save_video_viewer";
-const PREVIEW_CHROME = 12;
+const PREVIEW_CHROME = 38;
 // Height the node opens at. It used to fall out of the panel's computeSize;
 // with the panel free to follow the node, the default has to be stated. Same
 // 16:9-ish stage the width-derived formula produced, plus the widget rows.
@@ -38,7 +39,7 @@ function getLoopEnabled(node) {
   return !!node.properties.ausboss_save_video_loop;
 }
 
-// The STEPS button: the hidden `step_preview` widget (the card hides it).
+// The Preview steps switch: the hidden `step_preview` widget (the card hides it).
 // On, the player shows each step of the clip's first frame while it is
 // being made, and a STOP button joins the tools for the run.
 function stepsOn(state) {
@@ -47,7 +48,7 @@ function stepsOn(state) {
 
 function syncSteps(state, run = stepRun()) {
   const on = stepsOn(state);
-  state.stepsButton?.classList.toggle("active", on);
+  state.stepsButton?.setAttribute("aria-checked", String(on));
   state.stopButton?.classList.toggle("live", on && run.status === "running");
   const overlay = state.stepOverlay;
   if (!on) {
@@ -130,11 +131,11 @@ function buildPreview(node) {
   loopButton.classList.add("ausboss-steps-loop");
   const stopButton = makeToolButton("STOP", "Stop this run now. The next run in the queue still starts.");
   stopButton.classList.add("ausboss-steps-stop");
-  const stepsButton = makeToolButton("STEPS", "Show the clip's first frame here while it is being made, one step at a time, with a Stop button. Off by default.");
+  const stepsButton = panelSwitch("Preview steps", "Show the clip's first frame here while it is being made, one step at a time, with a Stop button. Off by default.");
   tools.classList.add("ausboss-steps-tools");
-  tools.append(stopButton, stepsButton, loopButton);
+  tools.append(stopButton, loopButton);
   stage.append(video, image, status, tools);
-  root.append(stage);
+  root.append(stepsButton, stage);
 
   const widget = node.addDOMWidget(PREVIEW_WIDGET, "ausboss_video", root, {
     serialize: false,
@@ -147,7 +148,7 @@ function buildPreview(node) {
   widget.serialize = false;
   fillNodeHeight(widget, {
     minWidth: VIDEO_MIN_WIDTH,
-    minHeight: 144,
+    minHeight: 158,
     minNodeSize: [VIDEO_MIN_WIDTH, 270],
     exactMinWidth: true,
   });

js/seed/index.js

@@ -11,7 +11,7 @@
 // is what "last run" shows, so it stays right even after randomize has
 // already moved the box on to the next number.
 
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import { isForeignRun } from "../shared/prompt_scope.mjs";
 import { keepKeyInField } from "../shared/canvas_passthrough.mjs";
 import { BRAND, chainCallback, keepDomWidgetWidthAuto, notifyAusbossChange } from "../shared/index.mjs";
@@ -19,6 +19,8 @@ import { copyToClipboard } from "../shared/clipboard.mjs";
 import { hideInputsInDef, hideWidget } from "../shared/widget_visibility.mjs";
 import { holdNodeMinWidth, pinVuePanelHeight } from "../shared/panel_layout.mjs";
 import { formatSeed, pushSeed, seedFromExecuted } from "../shared/seed_history.mjs";
+import { SEED_LOOK_MENU, SEED_LOOK_SCOPE, controlChip, nextControl, seedLook, setSeedLook } from "../shared/seed_look.mjs";
+import { gearIconSvg, loadSettings, openSettingsMenu } from "../shared/settings_menu.mjs";
 
 const NODE_CLASS = "AUSBOSS_NODES_Seed";
 const CSS_ID = "ausboss-seed-css";
@@ -28,8 +30,19 @@ const PROPERTY = "ausboss_seed_history"; // [seed, newest first]
 // in a double; a fresh seed rolled here obeys the same ceiling.
 const ROLL_MAX = 0x4000000000000;
 const CARD_HEIGHT = 158;
-const PANEL_DECLARED_HEIGHT = CARD_HEIGHT + 20; // + the frontend's wrapper insets
+// The compact look is one row: 8px card padding, a 32px row, 8px padding.
+const COMPACT_CARD_HEIGHT = 50;
+const PANEL_INSETS = 20; // the frontend's wrapper insets
 const NODE_WIDTH = 300;
+const COMPACT_NODE_WIDTH = 290;
+
+function panelHeight(node) {
+  return (seedLook(node) === "compact" ? COMPACT_CARD_HEIGHT : CARD_HEIGHT) + PANEL_INSETS;
+}
+
+function nodeWidthFloor(node) {
+  return seedLook(node) === "compact" ? COMPACT_NODE_WIDTH : NODE_WIDTH;
+}
 
 let openMenu = null;
 
@@ -59,6 +72,21 @@ function ensureCss() {
 .ausboss-seed-btn:disabled{opacity:.4;cursor:default;pointer-events:none;}
 .ausboss-seed-hint{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#6f8886;font-size:10.5px;text-align:center;}
 .ausboss-seed-hint b{color:#9fe3dc;font-weight:600;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;}
+.ausboss-seed-top{display:flex;align-items:center;gap:6px;min-width:0;}
+.ausboss-seed-top .ausboss-seed-field{flex:1 1 auto;min-width:0;}
+.ausboss-seed-gear{display:grid;place-items:center;}
+.ausboss-seed-chip,.ausboss-seed-dice{display:none;flex:none;height:32px;border:1px solid #2a3437;border-radius:7px;background:#0f1516;color:#d8ecea;font:600 11.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer;pointer-events:auto;}
+.ausboss-seed-chip{min-width:56px;padding:0 7px;}
+.ausboss-seed-chip.random{border-color:rgba(0,180,170,.55);color:${BRAND};}
+.ausboss-seed-dice{width:32px;font-size:15px;}
+.ausboss-seed-chip:hover,.ausboss-seed-dice:hover{border-color:${BRAND};color:#fff;}
+.ausboss-seed-card.compact{gap:0;}
+.ausboss-seed-card.compact .ausboss-seed-seg,.ausboss-seed-card.compact .ausboss-seed-row,.ausboss-seed-card.compact .ausboss-seed-hint{display:none;}
+.ausboss-seed-card.compact .ausboss-seed-chip,.ausboss-seed-card.compact .ausboss-seed-dice{display:block;}
+.ausboss-seed-card.compact .ausboss-seed-field{height:32px;padding:0 3px 0 9px;}
+.ausboss-seed-card.compact .ausboss-seed-field input{font-size:14px;}
+.ausboss-seed-card.compact .ausboss-seed-tag,.ausboss-seed-card.compact .ausboss-seed-icon:not(.ausboss-seed-gear){display:none;}
+.ausboss-seed-card.compact .ausboss-seed-field input{font-size:13.5px;letter-spacing:0;}
 .ausboss-seed-menu{position:fixed;z-index:10000;min-width:230px;padding:4px;border:1px solid #3a4047;border-radius:7px;background:#1c1f23;box-shadow:0 8px 28px rgba(0,0,0,.5);font:12px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#d7dde2;}
 .ausboss-seed-menu-head{padding:5px 8px 6px;border-bottom:1px solid #2c3238;color:#78908e;font:10px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.08em;text-transform:uppercase;}
 .ausboss-seed-menu-item{display:block;width:100%;padding:6px 8px;border:none;border-radius:5px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;}
@@ -124,6 +152,7 @@ function render(state) {
   const linked = seedLinked(node);
   const value = seedWidget(node)?.value;
   if (document.activeElement !== state.input) state.input.value = formatSeed(Number(value));
+  fitCompactNumber(state);
   state.input.disabled = linked;
   state.field.classList.toggle("linked", linked);
   state.field.title = linked ? "The seed comes from its input link" : "Click to type a seed";
@@ -136,6 +165,11 @@ function render(state) {
   state.segStep.title = stepping
     ? "Click again to step the other way"
     : "Increment the seed after each queue (click again for decrement)";
+  const chip = controlChip(control);
+  state.chip.textContent = chip.text;
+  state.chip.title = chip.title;
+  state.chip.classList.toggle("random", control === "randomize");
+  state.card.classList.toggle("compact", seedLook(node) === "compact");
   state.useLast.disabled = !seeds.length;
   state.more.disabled = seeds.length < 2;
   state.hint.textContent = "";
@@ -145,6 +179,8 @@ function render(state) {
     b.textContent = formatSeed(last);
     state.hint.append(b);
     if (control === "randomize") state.hint.append(" · rolls a new seed each queue");
+    // The compact look has no hint line: the last run shows on the number.
+    if (seedLook(node) === "compact") state.field.title = `${state.field.title}. Last run: ${formatSeed(last)}`;
   } else {
     state.hint.textContent = control === "randomize"
       ? "rolls a new seed each queue"
@@ -152,6 +188,16 @@ function render(state) {
   }
 }
 
+// The compact row is narrow, so a long seed gets smaller digits instead of
+// being cut off: monospace digits are about 0.6 of the font size wide.
+function fitCompactNumber(state) {
+  const { input } = state;
+  if (seedLook(state.node) !== "compact") { input.style.fontSize = ""; return; }
+  const digits = Math.max(1, String(input.value || "").length);
+  const room = input.clientWidth || 100;
+  input.style.fontSize = `${Math.max(8, Math.min(13.5, room / (0.64 * digits))).toFixed(1)}px`;
+}
+
 function showMenu(state) {
   closeMenu();
   const seeds = history(state.node);
@@ -241,7 +287,9 @@ function buildPanel(node) {
   input.inputMode = "numeric";
   input.spellcheck = false;
   const copy = button("ausboss-seed-icon", "⧉", "Copy the seed");
-  field.append(tag, input, copy);
+  const gear = button("ausboss-seed-icon ausboss-seed-gear", "", "Seed settings: full or compact look");
+  gear.innerHTML = gearIconSvg(12);
+  field.append(tag, input, copy, gear);
   field.addEventListener("pointerdown", (event) => event.stopPropagation());
 
   const seg = el("div", "ausboss-seed-seg");
@@ -257,11 +305,16 @@ function buildPanel(node) {
   row.append(newSeed, useLast, more);
 
   const hint = el("div", "ausboss-seed-hint");
-  card.append(field, seg, row, hint);
+  // Compact look: the mode chip and a dice sit on the number's row.
+  const chip = button("ausboss-seed-chip", "Fixed");
+  const dice = button("ausboss-seed-dice", "🎲", "Roll a fresh seed and pin it (Fixed)");
+  const top = el("div", "ausboss-seed-top");
+  top.append(field, chip, dice);
+  card.append(top, seg, row, hint);
   root.append(card);
 
   const state = (node.__ausbossSeed = {
-    node, root, field, tag, input, copy, segRandom, segFixed, segStep, newSeed, useLast, more, hint,
+    node, root, card, field, tag, input, copy, gear, chip, dice, segRandom, segFixed, segStep, newSeed, useLast, more, hint,
   });
 
   const commitTyped = () => {
@@ -304,6 +357,31 @@ function buildPanel(node) {
     notifyAusbossChange();
   });
   newSeed.addEventListener("click", () => { setSeed(node, rollSeed()); render(state); });
+  dice.addEventListener("click", () => { setSeed(node, rollSeed()); render(state); });
+  // The chip walks the same modes as the full card's buttons, and starts a
+  // new run the same way: into Random rolls now, Fixed into +1 steps now.
+  chip.addEventListener("click", () => {
+    const current = controlWidget(node)?.value ?? "fixed";
+    const next = nextControl(current);
+    setControl(node, next);
+    if (!seedLinked(node)) {
+      const value = Number(seed.value) || 0;
+      if (next === "randomize") setSeed(node, rollSeed(), { pin: false });
+      else if (current === "fixed" && next === "increment") setSeed(node, value + 1, { pin: false });
+    }
+    render(state);
+    notifyAusbossChange();
+  });
+  gear.addEventListener("click", () => {
+    openSettingsMenu({
+      scope: SEED_LOOK_SCOPE,
+      schema: SEED_LOOK_MENU,
+      anchor: gear.getBoundingClientRect(),
+      title: "Seed settings",
+      initial: { look: seedLook(node) },
+      onChange: (values) => applyLook(state, values.look),
+    });
+  });
   useLast.addEventListener("click", () => {
     const seeds = history(node);
     if (seeds.length) { setSeed(node, seeds[0]); render(state); }
@@ -318,7 +396,7 @@ function buildPanel(node) {
   const widget = node.addDOMWidget(WIDGET_NAME, "ausboss_seed", root, {
     serialize: false,
     hideOnZoom: false,
-    getMinHeight: () => PANEL_DECLARED_HEIGHT,
+    getMinHeight: () => panelHeight(node),
   });
   keepDomWidgetWidthAuto(widget);
   // Not saved with the workflow either: options.serialize only keeps it out
@@ -327,18 +405,20 @@ function buildPanel(node) {
   // A constant-height card: pinned on purpose (see
   // tests/panel_guards.test.mjs, fixedByDesign).
   widget.computeSize = (width) => [
-    Math.max(NODE_WIDTH, Number(width || node.size?.[0] || NODE_WIDTH)),
-    PANEL_DECLARED_HEIGHT,
+    Math.max(nodeWidthFloor(node), Number(width || node.size?.[0] || nodeWidthFloor(node))),
+    panelHeight(node),
   ];
   // Pinned in Nodes 2.0 as well, where a node can be made taller than its card.
   pinVuePanelHeight(widget);
-  widget.options.minNodeSize = [NODE_WIDTH, 120];
+  widget.options.minNodeSize = [nodeWidthFloor(node), 60];
   // The frontend skips a pinned card's width, so its floor is held here.
-  holdNodeMinWidth(widget, NODE_WIDTH);
+  holdNodeMinWidth(widget, nodeWidthFloor(node));
+  state.widget = widget;
 
+  new ResizeObserver(() => fitCompactNumber(state)).observe(input);
   render(state);
   node.setSize?.([
-    Math.max(node.size?.[0] ?? 0, NODE_WIDTH),
+    Math.max(node.size?.[0] ?? 0, nodeWidthFloor(node)),
     node.computeSize?.()[1] ?? node.size?.[1],
   ]);
   // The card is a fixed-height row: width may grow, but a corner drag
@@ -356,18 +436,49 @@ function buildPanel(node) {
   return state;
 }
 
+// Switch looks: the card, the node's floor and its height follow. Going
+// compact also makes the node as narrow as the compact row allows, and
+// going full widens it back to the full card's floor.
+function applyLook(state, look) {
+  const { node } = state;
+  const before = seedLook(node);
+  const after = setSeedLook(node, look);
+  if (before === after) return;
+  render(state);
+  if (state.widget) {
+    state.widget.options.minNodeSize = [nodeWidthFloor(node), 60];
+    holdNodeMinWidth(state.widget, nodeWidthFloor(node));
+  }
+  const width = after === "compact" ? COMPACT_NODE_WIDTH : Math.max(node.size?.[0] ?? 0, NODE_WIDTH);
+  node.setSize?.([width, node.computeSize?.()[1] ?? node.size?.[1]]);
+  node.setDirtyCanvas?.(true, true);
+  notifyAusbossChange();
+}
+
 app.registerExtension({
   name: "AusBoss.Seed",
   beforeRegisterNodeDef(nodeType, nodeData) {
     if (nodeData?.name !== NODE_CLASS) return;
     hideInputsInDef(nodeData, ["seed"]);
     chainCallback(nodeType.prototype, "onNodeCreated", function () {
-      buildPanel(this);
+      // A new node starts in the look last picked from any Seed's gear. A
+      // loaded one keeps its own: onConfigure restores its properties after.
+      if (loadSettings(SEED_LOOK_SCOPE, SEED_LOOK_MENU).look === "compact") setSeedLook(this, "compact");
+      const state = buildPanel(this);
+      if (state && seedLook(this) === "compact") {
+        this.setSize?.([COMPACT_NODE_WIDTH, this.computeSize?.()[1] ?? this.size?.[1]]);
+      }
     });
     chainCallback(nodeType.prototype, "onConfigure", function () {
       queueMicrotask(() => {
         const state = buildPanel(this);
-        if (state) render(state);
+        if (!state) return;
+        render(state);
+        // A saved compact Seed: lower the floor to the compact row's.
+        if (state.widget) {
+          state.widget.options.minNodeSize = [nodeWidthFloor(this), 60];
+          holdNodeMinWidth(state.widget, nodeWidthFloor(this));
+        }
       });
     });
     chainCallback(nodeType.prototype, "onConnectionsChange", function () {

js/shared/callout.mjs

@@ -45,6 +45,24 @@ const LINK = `#(${ID})`;
 const WORDS_LINK_RE = /\[([^\[\]\n]+)\]\(([^\s()]+(?:\([^\s()]*\)[^\s()]*)*)\)/g;
 const URL_MAX = 2000;
 
+// Only a whole, ordinary web link gets the simple label/address form. Keep
+// multi-paragraph or mixed-content notes in the text editor, without loss.
+export function tileLinkFields(text) {
+  const value = String(text ?? "");
+  const match = /^\[([^\[\]\n]+)\]\((.+)\)$/.exec(value);
+  if (!match || !linkTarget(match[2])?.url) return null;
+  const blocks = parseBlocks(value);
+  if (blocks.length !== 1 || blocks[0].length !== 1
+    || blocks[0][0].some(piece => piece.url !== match[2])) return null;
+  return { label: match[1], url: match[2] };
+}
+
+export function tileLinkText(label, url) {
+  const text = `[${label}](${url.trim()})`;
+  if (!tileLinkFields(text)) throw new Error("Enter a label without square brackets and a complete https:// or http:// address.");
+  return text;
+}
+
 // Where a link goes: { url }, { link } (a node's id) or { group } (a group's
 // id), or null when the text is none of them. `raw` is what stands in the
 // round brackets, or after an arrow's #.

js/shared/canvas_passthrough.mjs

@@ -10,11 +10,15 @@
 
 // The wheel belongs to the panel while it can still scroll that way (a long
 // text box, a list of rows), or while a text field has the keyboard.
-export function canScrollFurther(element, deltaY) {
-  if (!element || !deltaY) return false;
-  const room = element.scrollHeight - element.clientHeight;
+export function canScrollFurther(element, delta, axis = "y") {
+  if (!element || !delta) return false;
+  const horizontal = axis === "x";
+  const size = horizontal ? element.scrollWidth : element.scrollHeight;
+  const visible = horizontal ? element.clientWidth : element.clientHeight;
+  const start = horizontal ? element.scrollLeft : element.scrollTop;
+  const room = size - visible;
   if (room <= 1) return false;
-  return deltaY > 0 ? element.scrollTop + element.clientHeight < element.scrollHeight - 1 : element.scrollTop > 0;
+  return delta > 0 ? start + visible < size - 1 : start > 0;
 }
 
 // Does the wheel belong to something inside the panel, between the target
@@ -25,8 +29,11 @@ export function panelKeepsWheel(target, event, { root, host, styleOf, activeElem
   for (let element = target; element && element !== root && element !== host; element = element.parentElement) {
     const tag = String(element.tagName ?? "").toUpperCase();
     if ((tag === "TEXTAREA" || tag === "INPUT") && element === activeElement) return true;
-    const overflow = styleOf(element)?.overflowY;
+    const style = styleOf(element);
+    const overflow = style?.overflowY;
     if ((overflow === "auto" || overflow === "scroll") && canScrollFurther(element, event.deltaY)) return true;
+    const overflowX = style?.overflowX;
+    if ((overflowX === "auto" || overflowX === "scroll") && canScrollFurther(element, event.deltaX, "x")) return true;
   }
   return false;
 }

js/shared/compare_erase_stage.mjs

@@ -5,14 +5,14 @@
 // a mask canvas holds what has been rubbed away, and the view shows the
 // picture underneath with the top picture, less that mask, over it. Save
 // sends the strokes to the server, which builds the mix at full size.
-import { api } from "/scripts/api.js";
+import { compactAction } from "./panel_controls.mjs";
+import { api } from "../../../scripts/api.js";
 import { BRAND, notifyAusbossChange, showToast } from "./index.mjs";
 import { brushAdjusts, brushFlips, brushKey, brushWords, toolKey } from "./brush.mjs";
 import { keepKeyInField } from "./canvas_passthrough.mjs";
 import { makeScrubInput } from "./scrub_input.mjs";
 import { makeSlideSwitch } from "./slide_switch.mjs";
 import { extendStroke } from "./touch_math.mjs";
-import { makeToolButton } from "./video_ui.mjs";
 import {
   CHECKER,
   ERASE_OUTSIDE,
@@ -82,6 +82,7 @@ const CAN_FILTER = typeof CanvasRenderingContext2D !== "undefined" && "filter" i
 export const ERASE_CSS = `
 .ausboss-compare-erasebar{display:none;box-sizing:border-box;flex-wrap:wrap;align-items:center;gap:4px 6px;flex:none;min-height:${ERASE_BAR_HEIGHT}px;}
 .ausboss-compare-root.is-erasing .ausboss-compare-erasebar{display:flex;}
+.ausboss-compare-brush-swatch{box-sizing:border-box;flex:none;width:24px;height:24px;border-radius:4px;background:#0b1113;border:1px solid rgba(0,180,170,.3);}
 .ausboss-compare-erasebar .ausboss-scrub{flex:none;}
 .ausboss-compare-field{display:flex;align-items:center;gap:4px;flex:none;}
 .ausboss-compare-label{flex:none;color:#9fb6b4;font-size:10px;line-height:22px;white-space:nowrap;user-select:none;}
@@ -247,9 +248,32 @@ function drawCheckerboard(er, ctx, fit) {
   ctx.fillRect(fit.left, fit.top, fit.width, fit.height);
 }
 
+// Use the cursor's actual dab. A compressed size scale keeps both a
+// two-pixel brush and a two-thousand-pixel brush legible in the toolbar.
+function drawBrushSwatch(er) {
+  const size = brushSize(er);
+  const soft = brushSoft(er);
+  const back = er.back !== Boolean(er.flipKey);
+  const key = `${size}|${soft}|${back}`;
+  if (er.swatchKey === key) return;
+  er.swatchKey = key;
+  const swatch = er.swatch;
+  const side = swatch.width;
+  const fraction = Math.log(size / ERASE_SIZE[0]) / Math.log(ERASE_SIZE[1] / ERASE_SIZE[0]);
+  const diameter = side * (0.22 + 0.66 * fraction);
+  const dab = dabOf(er, size, soft, diameter / size, back ? BACK_TINT : RUB_TINT);
+  const ctx = swatch.getContext("2d");
+  ctx.clearRect(0, 0, side, side);
+  ctx.drawImage(dab.canvas, side / 2 - dab.reach, side / 2 - dab.reach);
+  swatch.title = `${back ? "Restore" : "Erase"} brush: ${size} px, ${soft}% soft`;
+  swatch.setAttribute("aria-label", swatch.title);
+}
+
 function draw(er) {
   er.frame = 0;
-  if (!er.active || !er.refs) return;
+  if (!er.active) return;
+  drawBrushSwatch(er);
+  if (!er.refs) return;
   sizeView(er);
   const { canvas } = er;
   const ctx = canvas.getContext("2d");
@@ -377,7 +401,7 @@ function syncTools(er) {
   er.layersSwitch.set(layers ? "on" : "off");
   const aligned = Boolean(er.refs?.aligned);
   er.alignButton.disabled = !ready || er.aligning;
-  er.alignButton.textContent = er.aligning ? "ALIGNING" : "ALIGN";
+  er.alignButton.textContent = er.aligning ? "Aligning" : "Align";
   er.alignButton.classList.toggle("active", aligned);
   er.alignButton.title = !ready
     ? "Run the workflow first: Align needs the two pictures."
@@ -604,7 +628,7 @@ function installPointer(er, signal) {
 }
 
 async function save(er) {
-  if (er.saving || !er.refs) return;
+  if (er.signal.aborted || er.saving || !er.refs) return;
   er.saving = true;
   syncTools(er);
   try {
@@ -620,6 +644,7 @@ async function save(er) {
       })),
     });
     const answer = await response.json().catch(() => null);
+    if (er.signal.aborted) return;
     if (!response.ok) {
       // No words from the route: this ComfyUI started before the update.
       const missing = (response.status === 404 || response.status === 405) && !answer?.error;
@@ -628,10 +653,11 @@ async function save(er) {
     showToast({ severity: "success", summary: "Image Compare", detail: savedMessage(answer?.files) });
     er.onSaved?.(answer?.files ?? []);
   } catch (error) {
+    if (er.signal.aborted) return;
     showToast({ severity: "error", summary: "Image Compare", detail: String(error?.message ?? error), life: 8000 });
   } finally {
     er.saving = false;
-    syncTools(er);
+    if (!er.signal.aborted) syncTools(er);
   }
 }
 
@@ -639,20 +665,24 @@ async function save(er) {
 // to B as it came. The panel swaps in the pictures; Save and Copy then use
 // the lined-up B, and the paint stays where it is.
 async function align(er) {
-  if (er.aligning || !er.refs) return;
+  if (er.signal.aborted || er.aligning || !er.refs) return;
   if (er.refs.aligned) {
     er.onAligned?.(er.refs.original);
     return;
   }
   er.aligning = true;
+  const refs = er.refs;
+  const picturesVersion = er.picturesVersion;
+  const current = () => !er.signal.aborted && er.refs === refs && er.picturesVersion === picturesVersion;
   syncTools(er);
   try {
     const response = await api.fetchApi(ALIGN_ROUTE, {
       method: "POST",
       headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ pair: er.refs.pair }),
+      body: JSON.stringify({ pair: refs.pair }),
     });
     const answer = await response.json().catch(() => null);
+    if (!current()) return;
     if (!response.ok) {
       // No words from the route: this ComfyUI started before the update.
       const missing = (response.status === 404 || response.status === 405) && !answer?.error;
@@ -660,15 +690,16 @@ async function align(er) {
     }
     if (answer?.aligned && answer.b?.filename && typeof answer.pair === "string") {
       showToast({ severity: "success", summary: "Image Compare", detail: answer.message, life: 4000 });
-      er.onAligned?.({ ...er.refs, b: answer.b, pair: answer.pair, aligned: true, original: er.refs });
+      er.onAligned?.({ ...refs, b: answer.b, pair: answer.pair, aligned: true, original: refs });
     } else {
       showToast({ severity: "info", summary: "Image Compare", detail: answer?.message || "B was left as it is.", life: 6000 });
     }
   } catch (error) {
+    if (!current()) return;
     showToast({ severity: "error", summary: "Image Compare", detail: String(error?.message ?? error), life: 8000 });
   } finally {
     er.aligning = false;
-    syncTools(er);
+    if (!er.signal.aborted) syncTools(er);
   }
 }
 
@@ -740,7 +771,7 @@ function copy(er) {
 // pictures change.
 export function makeEraser({ node, root, stage, imageA, imageB, signal, onSaved, onAligned }) {
   const er = {
-    node, root, stage, imageA, imageB, onSaved, onAligned,
+    node, root, stage, imageA, imageB, signal, onSaved, onAligned,
     canvas: document.createElement("canvas"),
     mask: document.createElement("canvas"),
     live: document.createElement("canvas"),
@@ -748,7 +779,7 @@ export function makeEraser({ node, root, stage, imageA, imageB, signal, onSaved,
     dab: document.createElement("canvas"),
     dabKey: "",
     maskScale: 1,
-    refs: null, width: 0, height: 0, fit: null,
+    refs: null, picturesVersion: 0, width: 0, height: 0, fit: null,
     strokes: [], history: [],
     active: false, stroke: null, adjust: null, pointer: null, back: false, flipKey: false,
     saving: false, copying: false, frame: 0, keys: null,
@@ -827,6 +858,11 @@ export function makeEraser({ node, root, stage, imageA, imageB, signal, onSaved,
     return wrap;
   };
   const sizeField = scrubField("Size", er.sizeBox, SIZE_HELP);
+  er.swatch = document.createElement("canvas");
+  er.swatch.className = "ausboss-compare-brush-swatch";
+  er.swatch.width = er.swatch.height = 64;
+  er.swatch.setAttribute("role", "img");
+  sizeField.prepend(er.swatch);
   const softField = scrubField("Soft", er.softBox, SOFT_HELP);
   const TOP_HELP = "Which picture you start from. The brush shows the other one through it. Swapping keeps your paint.";
   er.topSwitch = makeSlideSwitch({
@@ -846,7 +882,7 @@ export function makeEraser({ node, root, stage, imageA, imageB, signal, onSaved,
   // Align, Undo and Clear stay together at the right end, also on a second line.
   const steps = document.createElement("div");
   steps.className = "ausboss-compare-steps";
-  er.undoButton = click(makeToolButton("UNDO", "Take back the last stroke, or a Clear."), () => {
+  er.undoButton = click(compactAction("Undo", "Take back the last stroke, or a Clear."), () => {
     if (!er.history.length && !er.strokes.length) return;
     // Paint that came with the workflow has no steps of its own to go back
     // through: its last stroke is taken off.
@@ -856,13 +892,13 @@ export function makeEraser({ node, root, stage, imageA, imageB, signal, onSaved,
     syncTools(er);
     schedule(er);
   });
-  er.clearButton = click(makeToolButton("CLEAR", "Take all the paint off. Undo brings it back."), () => {
+  er.clearButton = click(compactAction("Clear", "Take all the paint off. Undo brings it back."), () => {
     if (!er.strokes.length) return;
     change(er, []);
     rebuildMask(er);
     schedule(er);
   });
-  er.alignButton = click(makeToolButton("ALIGN", ""), () => align(er));
+  er.alignButton = click(compactAction("Align", ""), () => align(er));
   steps.append(er.alignButton, er.undoButton, er.clearButton);
   er.bar.append(er.kindSwitch.root, sizeField, softField, topField, steps);
 
@@ -956,6 +992,7 @@ export function makeEraser({ node, root, stage, imageA, imageB, signal, onSaved,
     // Both pictures are loaded (or, with null, on their way). The paint is
     // read from the node, and kept only while the picture keeps its size.
     setPictures(refs) {
+      er.picturesVersion += 1;
       const ready = Boolean(refs && imageA.naturalWidth > 0 && imageB.naturalWidth > 0);
       er.refs = ready ? refs : null;
       finishStroke(er, null, true);

js/shared/h3_cast_chips.mjs

@@ -2,7 +2,7 @@
 // name, a small copy of it and its job, then the video and its job. A slot with nothing plugged in is a faint
 // dashed chip, so it reads as optional. The widgets underneath stay the
 // source of truth: a chip only changes their value.
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 import { BRAND, chainCallback } from "./index.mjs";
 import { liftSocket } from "./widget_card.mjs";
 import { commitWidgetValue, comboValues } from "./widget_card_math.mjs";

js/shared/h3_duration.mjs

@@ -0,0 +1,16 @@
+// The same live-input rule used by the writer timeline: muted/bypassed
+// sources do not reach this node. This inspects the wire, never media bytes.
+export function linkSource(node, name) {
+  const slot = node.inputs?.find((input) => input?.widget?.name === name || input?.name === name);
+  if (slot?.link === null || slot?.link === undefined) return null;
+  const graph = node.graph;
+  const link = graph?.links?.[slot.link] ?? graph?._links?.get?.(slot.link);
+  const source = graph?.getNodeById?.(link?.origin_id);
+  return (source?.mode ?? 0) === 0 ? source ?? null : null;
+}
+
+// Keep in step with Python KEEPS_ITS_LENGTH. Other jobs use seconds normally.
+export function clipSetsDuration(node, values) {
+  return ["swap the person", "new voice", "change something"].includes(values.video_job)
+    && linkSource(node, "video") !== null;
+}

js/shared/image_folder.mjs

@@ -93,8 +93,10 @@ export function nameAt(picked, names, position, atTheEnd) {
 // the first, so Picture always names a real picture. A Picture already past
 // the end (saved by an older version) steps on from the picture it loaded.
 // "random" jumps to any picked picture (`roll` is 0..1, for tests).
+// With an unknown count, "next" keeps advancing and the backend handles the end.
 export function nextPosition(position, count, afterRun, atTheEnd = "stop the run", roll = Math.random()) {
   const place = Math.max(1, Math.round(Number(position) || 1));
+  if (count == null) return afterRun === "next" ? place + 1 : place;
   if (count < 1) return place;
   if (afterRun === "random") return Math.min(count, Math.floor(roll * count) + 1);
   if (afterRun !== "next") return place;
@@ -124,6 +126,12 @@ export function childOf(folder, name) {
   return [...String(folder ?? "").split("/").filter(Boolean), name].join("/");
 }
 
+// A relative name belongs to one folder, even when another has the same name.
+export function folderContext({ source, folder, subfolders }) {
+  const relative = String(folder ?? "").trim().replaceAll("\\", "/").split("/").filter(part => part && part !== ".").join("/");
+  return JSON.stringify([source, relative, Boolean(subfolders)]);
+}
+
 // A query string. Every value is typed by a person or saved in a workflow.
 export function query(params) {
   return Object.entries(params)

js/shared/index.mjs

@@ -4,12 +4,12 @@
 // which makes this the right home for import-only utilities. Per-node
 // entry points live in js/<node>/index.js and import from here.
 
-import { app } from "/scripts/app.js";
+import { app } from "../../../scripts/app.js";
 
 // Must match `version` in pyproject.toml — scripts/release_preflight.py
 // enforces it. The backend serves its copy at /ausboss/pack_version; a
 // mismatch means the browser cached JavaScript from an older install.
-export const AUSBOSS_JS_VERSION = "2.20.5";
+export const AUSBOSS_JS_VERSION = "2.23.0";
 
 export const BRAND = "#00b4aa"; // AusBoss teal — keep node accents consistent.
 export const BRAND_DARK = "#007f78";

js/shared/lora_stack.mjs

@@ -12,7 +12,6 @@ export const FINE_STEP = 0.01;
 // large enough that a shaky click cannot change the value.
 export const SCRUB_PIXELS_PER_STEP = 4;
 export const SCRUB_DEAD_ZONE = 3;
-export const MAX_ROWS = 64;
 
 let rowSerial = 0;
 
@@ -40,7 +39,7 @@ export function newRow() {
 
 export function normalizeRows(parsed) {
   if (!Array.isArray(parsed)) return [];
-  return tidyGroups(parsed.slice(0, MAX_ROWS).map((entry) => {
+  return tidyGroups(parsed.map((entry) => {
     const row = newRow();
     if (entry && typeof entry === "object") {
       row.id = typeof entry.id === "string" && entry.id ? entry.id : row.id;
@@ -600,9 +599,8 @@ export function loraPickerEntries(names, query = "", collapsedFolders = new Set(
   return visit(tree);
 }
 
-// Folder add is one append, or no change when the whole selection cannot
-// fit. Existing rows (even duplicates, disabled rows and empty slots) stay
-// untouched. Deduplicate by full path, never basename or moved-file guess.
+// Append the folder in one step, preserving duplicates, disabled rows and
+// empty slots already in the stack. Deduplicate new files by full path.
 export function appendFolderRows(rows, names, defaultStrength = 1) {
   const seen = new Set(rows.map((row) => loraPath(row.name)));
   const pending = [];
@@ -613,12 +611,10 @@ export function appendFolderRows(rows, names, defaultStrength = 1) {
     seen.add(key);
     pending.push(name);
   }
-  const room = Math.max(0, MAX_ROWS - rows.length);
-  const needed = pending.length;
-  if (needed > room || !needed) return { rows, added: 0, skipped, needed, room };
+  if (!pending.length) return { rows, added: 0, skipped };
   const strength = roundStrength(defaultStrength);
   const addedRows = pending.map((name) => ({ ...newRow(), name, strength, strength_clip: strength }));
-  return { rows: [...rows, ...addedRows], added: needed, skipped, needed, room };
+  return { rows: [...rows, ...addedRows], added: addedRows.length, skipped };
 }
 
 // A suggested range is advisory: null/absent bounds never flag.
@@ -1031,9 +1027,9 @@ export function mergeImportedRows(existing, imported,
     have.add(key);
     added.push({ ...makeRow(), ...item });
   }
-  const rows = (position === "after"
+  const rows = position === "after"
     ? [...(existing ?? []), ...added]
-    : [...added, ...(existing ?? [])]).slice(0, MAX_ROWS);
+    : [...added, ...(existing ?? [])];
   return { rows, added: added.length, skipped };
 }
 

js/shared/media_list.mjs

@@ -29,7 +29,7 @@ export function filterMedia(values, query) {
 export function unlistedMedia(values, value) {
   const text = String(value ?? "");
   if (!text || !Array.isArray(values)) return "";
-  const bare = text.replace(/\s+\[(input|output)\]$/, "");
+  const bare = text.replace(/\s+\[input\]$/, "");
   return values.includes(text) || values.includes(bare) ? "" : text;
 }
 

js/shared/moment_strip.mjs

@@ -2,8 +2,9 @@
 // bar as long as the clip, with the cuts as marks. The server reads the script with the same code a run uses,
 // so the bar shows what will happen. It also colours the script box, so the
 // words the node reads as instructions (@1, 3s:, a cut) stand out.
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { clipSetsDuration, linkSource } from "./h3_duration.mjs";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { BRAND, chainCallback } from "./index.mjs";
 import { dragRange, moveMoment, retime, rulerSeconds, stripCaption, stripRows, toggleCut, wiredJobs } from "./moment_strip_math.mjs";
 import { attachScriptAssist } from "./script_assist.mjs";
@@ -47,16 +48,6 @@ function ensureCss() {
   document.head.append(style);
 }
 
-// A bypassed or muted source doesn't reach the node when it runs, so it doesn't count.
-function linkSource(node, name) {
-  const slot = node.inputs?.find((input) => input?.widget?.name === name || input?.name === name);
-  if (slot?.link === null || slot?.link === undefined) return null;
-  const graph = node.graph;
-  const link = graph?.links?.[slot.link] ?? graph?._links?.get?.(slot.link);
-  const source = graph?.getNodeById?.(link?.origin_id);
-  return (source?.mode ?? 0) === 0 ? source ?? {} : null;
-}
-
 function wired(node, name) {
   return linkSource(node, name) !== null;
 }
@@ -93,7 +84,7 @@ export function momentStrip(node) {
     })),
     cameras: choices("camera"),
     looks: choices("look"),
-    seconds: Number(lastSeconds) || 8,
+    seconds: clipSetsDuration(node, lastValues) ? 0 : Number(lastSeconds) || 8,
   }));
 
   let lastValues = {};
@@ -275,17 +266,38 @@ export function momentStrip(node) {
         body: JSON.stringify({ script, seconds, jobs, video }),
       });
       const report = response.ok ? await response.json() : null;
-      if (turn === asked) show(report);
+      if (turn === asked && !clipSetsDuration(node, lastValues)) show(report);
     } catch {
-      if (turn === asked) show(null);
+      if (turn === asked && !clipSetsDuration(node, lastValues)) show(null);
     }
   };
 
   let latest = null;
+  let fromClip = false;
   const sync = (values) => {
     latest = values;
     lastValues = values;
+    const nextFromClip = clipSetsDuration(node, values);
+    if (fromClip !== nextFromClip) {
+      fromClip = nextFromClip;
+      // Also notice a source switched off without changing this node's wires.
+      queueMicrotask(() => node.__ausbossCard?.refresh?.());
+    }
     colours.sync(values, [1, 2, 3, 4].filter((number) => wired(node, `picture_${number}`)));
+    if (fromClip) {
+      shown = null;
+      clearTimeout(timer);
+      asked += 1;
+      ruler.textContent = "";
+      track.textContent = "";
+      const message = el("ausboss-strip-words", "Length comes from the clip");
+      message.style.cssText = "display:flex;align-items:center;height:100%";
+      track.append(message);
+      note.textContent = "Set the clip's length upstream. Timing controls are unavailable here.";
+      note.title = note.textContent;
+      note.classList.remove("warn");
+      return;
+    }
     if (wired(node, "script")) {
       shown = null;
       clearTimeout(timer);

js/shared/note_identity.mjs

@@ -0,0 +1,13 @@
+// A tile needs its renderer. Give saved tiles a real node identity so an old
+// install reports a missing node instead of stretching a plain note over it.
+export const CALLOUT_TYPES = new Set(["AUSBOSS_NODES_Callout", "AUSBOSS_NODES_CalloutTile"]);
+export const NOTE_TYPES = new Set(["AUSBOSS_NODES_WorkflowNote", "AUSBOSS_NODES_WorkflowNoteTile"]);
+
+export function serializeNoteIdentity(saved, tile) {
+  const types = CALLOUT_TYPES.has(saved.type) ? [...CALLOUT_TYPES]
+    : NOTE_TYPES.has(saved.type) ? [...NOTE_TYPES] : null;
+  if (!types) return;
+  saved.type = types[tile ? 1 : 0];
+  // LiteGraph's serialized properties can still be the live object's properties.
+  saved.properties = { ...saved.properties, "Node name for S&R": saved.type };
+}

js/shared/panel_controls.mjs

@@ -0,0 +1,55 @@
+// Shared controls for compact node panels. Only elements explicitly given one
+// of these classes are styled; the owning panel decides where they sit.
+import { FONT_UI, RADIUS_XS, THEME as T } from "./theme.mjs";
+
+export const PANEL_LABELS = Object.freeze({
+  load: "Load", sources: { input: "Inputs", output: "Outputs" },
+  embed: "Embed workflow", off: "Off", on: "On",
+});
+
+const controlFont = FONT_UI;
+export const CAPTION_TYPE = `font:600 11px/1.25 ${controlFont};color:${T.label};`;
+export const HINT_TYPE = `font:400 10px/1.25 ${controlFont};color:${T.faint};`;
+
+export function ensurePanelControls() {
+  if (document.getElementById("ausboss-panel-controls")) return;
+  const style = document.createElement("style");
+  style.id = "ausboss-panel-controls";
+  style.textContent = `
+.ausboss-compact-action{box-sizing:border-box;flex:none;height:22px;min-width:24px;padding:0 7px;border:1px solid transparent;border-radius:${RADIUS_XS}px;background:${T.fill};color:${T.inkSoft};font:600 11px/1 ${controlFont};white-space:nowrap;cursor:pointer;pointer-events:auto}
+.ausboss-compact-action:hover:enabled{color:${T.ink};background:${T.fillHover}}
+.ausboss-compact-action.active{color:${T.brandInk};background:${T.brandSoft}}
+.ausboss-compact-action:disabled{opacity:.5;cursor:default}
+.ausboss-panel-switch{display:inline-flex;align-items:center;gap:6px;align-self:flex-end;flex:none;box-sizing:border-box;min-height:20px;margin-left:auto;padding:0 2px;background:transparent;border:0;color:${T.label};font:600 11px/1 ${controlFont};cursor:pointer;user-select:none;pointer-events:auto}
+.ausboss-panel-switch i{position:relative;width:24px;height:13px;border-radius:7px;background:${T.switchOff}}
+.ausboss-panel-switch i::after{content:"";position:absolute;top:2px;left:2px;width:9px;height:9px;border-radius:50%;background:${T.inkSoft}}
+.ausboss-panel-switch[aria-checked=true] i{background:${T.brand}}
+.ausboss-panel-switch[aria-checked=true] i::after{left:13px;background:${T.inkHover}}
+.ausboss-compact-action:focus-visible,.ausboss-panel-switch:focus-visible{outline:2px solid ${T.brand};outline-offset:1px}
+`;
+  document.head.append(style);
+}
+
+export function compactAction(label, title = "") {
+  ensurePanelControls();
+  const button = document.createElement("button");
+  button.type = "button";
+  button.className = "ausboss-compact-action";
+  button.textContent = label;
+  button.title = title;
+  return button;
+}
+
+export function panelSwitch(label, title) {
+  ensurePanelControls();
+  const button = document.createElement("button");
+  button.type = "button";
+  button.className = "ausboss-panel-switch";
+  button.title = title;
+  button.setAttribute("role", "switch");
+  button.setAttribute("aria-checked", "false");
+  const thumb = document.createElement("i");
+  thumb.setAttribute("aria-hidden", "true");
+  button.append(label, thumb);
+  return button;
+}

js/shared/picture_stepper.mjs

@@ -3,7 +3,7 @@
 // steps through its pairs with it, and the preview panel of Save Image and
 // the other preview nodes through their results. It hides itself while
 // there is one picture or none, so a single picture looks as it always did.
-import { BRAND } from "./index.mjs";
+import { FONT_UI, RADIUS_CONTROL, RADIUS_XS, THEME as T } from "./theme.mjs";
 import { stepperLabel } from "./picture_steps.mjs";
 
 const CSS_ID = "ausboss-picture-stepper-v1";
@@ -13,12 +13,12 @@ function ensureCss() {
   const style = document.createElement("style");
   style.id = CSS_ID;
   style.textContent = `
-.ausboss-stepper{box-sizing:border-box;flex:none;display:flex;align-items:stretch;height:var(--ausboss-stepper-height,24px);padding:1px;border:1px solid #2a3437;border-radius:6px;background:#0f1516;pointer-events:auto;user-select:none;}
+.ausboss-stepper{box-sizing:border-box;flex:none;display:flex;align-items:stretch;height:var(--ausboss-stepper-height,24px);padding:1px;border:1px solid transparent;border-radius:${RADIUS_CONTROL}px;background:${T.fill};pointer-events:auto;user-select:none;}
 .ausboss-stepper[hidden]{display:none;}
-.ausboss-stepper button{box-sizing:border-box;width:20px;margin:0;padding:0;border:none;border-radius:4px;background:transparent;color:#8ba3a1;font:700 13px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer;}
-.ausboss-stepper button:hover{color:#fff;background:rgba(0,79,75,.78);}
-.ausboss-stepper button:focus-visible{outline:1px solid ${BRAND};outline-offset:-1px;}
-.ausboss-stepper span{min-width:34px;padding:0 3px;color:#d8eeee;font:700 10px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-variant-numeric:tabular-nums;text-align:center;white-space:nowrap;align-self:center;}
+.ausboss-stepper button{box-sizing:border-box;width:20px;margin:0;padding:0;border:none;border-radius:${RADIUS_XS}px;background:transparent;color:${T.label};font:600 13px/1 ${FONT_UI};cursor:pointer;}
+.ausboss-stepper button:hover{color:${T.ink};background:${T.fillHover};}
+.ausboss-stepper button:focus-visible{outline:1px solid ${T.brand};outline-offset:-1px;}
+.ausboss-stepper span{min-width:34px;padding:0 3px;color:${T.ink};font:600 10px/1 ${FONT_UI};font-variant-numeric:tabular-nums;text-align:center;white-space:nowrap;align-self:center;}
 `;
   document.head.appendChild(style);
 }

js/shared/resolution_math.mjs

@@ -129,13 +129,17 @@ export function ratioSizeNear(ratio, width, height, step = 1) {
 //   modifiers: snap (default true; false = 1px freedom),
 //              lockRatio (true = keep the grab-time ratio exactly).
 
-export function stageScale(width, height, boxW, boxH) {
-  // Fit with fixed headroom for the handles, corner hints, and the label
-  // (the design's 90px horizontal / 60px vertical margins), never below a
-  // sliver on a tiny stage.
-  const usableW = Math.max(40, boxW - 90);
-  const usableH = Math.max(40, boxH - 60);
-  return Math.max(0.002, Math.min(usableW / width, usableH / height));
+// Fit the selection inside its handles. If both corner readouts fit beside
+// the rectangle (or already fit above it), the full stage height is usable.
+export function fitStage(width, height, boxW, boxH, cornerRoom = 126) {
+  const pad = 10; // the outer half of an 18px handle plus a pixel of air
+  const fit = top => Math.min(Math.max(1, boxW - 2 * pad) / width,
+    Math.max(1, boxH - top - pad) / height);
+  const full = fit(pad);
+  const header = 26;
+  if ((boxW - width * full) / 2 >= cornerRoom || (boxH - height * full) / 2 >= header)
+    return { scale: full, shift: 0 };
+  return { scale: fit(header), shift: (header - pad) / 2 };
 }
 
 const HANDLE_AXES = {
@@ -406,3 +410,51 @@ export function sizeForMegapixels(width, height, targetMp, step = DEFAULT_SNAP)
   }
   return best;
 }
+
+// A workflow's list keeps the author's order and the exact orientation of each
+// pair. A near match, including a reversed pair, is a different model input.
+export function parseWorkflowSizes(text) {
+  const lines = text.trim().split(/\n/).map(line => line.trim()).filter(Boolean);
+  if (lines.length > 24) throw new Error("Choose up to 24 resolutions.");
+  const sizes = [];
+  for (const line of lines) {
+    const match = /^(\d{1,4})\s*[x×]\s*(\d{1,4})$/i.exec(line);
+    const pair = match?.slice(1).map(Number);
+    if (!pair || pair.some(n => n < DIM_MIN || n > DIM_MAX)) {
+      throw new Error(`Enter a width × height between ${DIM_MIN} and ${DIM_MAX} px on each line.`);
+    }
+    if (!sizes.some(([w, h]) => w === pair[0] && h === pair[1])) sizes.push(pair);
+  }
+  return sizes;
+}
+
+export function workflowRatios(sizes) {
+  const ratios = new Map();
+  for (const [width, height] of sizes) {
+    const { x, y } = reduceRatio(width, height);
+    const label = `${x}:${y}`;
+    if (!ratios.has(label)) ratios.set(label, { x, y, label, sizes: [] });
+    ratios.get(label).sizes.push({ width, height });
+  }
+  return [...ratios.values()];
+}
+
+export function readWorkflowPolicy(value) {
+  if (value === "") return { sizes: [], strict: false };
+  const invalid = () => { throw new Error("Invalid workflow resolutions."); };
+  if (typeof value !== "string" || value.length > 2048) invalid();
+  const policy = JSON.parse(value);
+  if (typeof policy?.strict !== "boolean" || !Array.isArray(policy.sizes)
+      || !policy.sizes.length || policy.sizes.length > 24
+      || !policy.sizes.every(pair => Array.isArray(pair) && pair.length === 2
+        && pair.every(n => Number.isInteger(n) && n >= DIM_MIN && n <= DIM_MAX))) invalid();
+  return { sizes: policy.sizes, strict: policy.strict };
+}
+
+
+// The panel used to occupy the appended widget's position in older saves.
+// Keep any other malformed value intact so strict settings cannot fail open.
+export function savedWorkflowPolicy(value, legacy) {
+  if (value != null && value !== "" && value !== "image") return value;
+  return Array.isArray(legacy) && legacy.length ? JSON.stringify({ strict: true, sizes: legacy }) : "";
+}

js/shared/run_check.mjs

@@ -20,6 +20,7 @@ const emptyWidget = (inputs, name) => !linked(inputs?.[name]) && blank(inputs?.[
 
 const picture = (name) => (inputs) => (emptyWidget(inputs, name) ? { input: name, kind: "picture" } : null);
 const video = (name) => (inputs) => (emptyWidget(inputs, name) ? { input: name, kind: "video" } : null);
+const sound = (name) => (inputs) => (emptyWidget(inputs, name) ? { input: name, kind: "sound file" } : null);
 
 function videoSource(inputs) {
   const mode = inputs?.source_mode;
@@ -38,6 +39,7 @@ export const SOURCE_LOADERS = Object.freeze({
   AUSBOSS_NODES_ImageCropRotatePad: picture("image"),
   // A wired source_image replaces the file, so the file may stay blank.
   AUSBOSS_NODES_LoadImagePad: (inputs) => (linked(inputs?.source_image) ? null : picture("image")(inputs)),
+  AUSBOSS_NODES_LoadAudio: sound("audio"),
   AUSBOSS_NODES_LoadVideo: video("video"),
   AUSBOSS_NODES_VideoCropRotatePad: videoSource,
   AUSBOSS_NODES_VideoCropRotatePadClip: videoSource,
@@ -110,7 +112,8 @@ export function emptySourceMessage(found) {
   if (!first) return "";
   const more = found.length - 1;
   const tail = more > 0 ? ` (and ${more} more node${more === 1 ? "" : "s"})` : "";
-  return `Load a ${first.kind === "video" ? "video" : "picture"} first: ${first.title}${tail}`;
+  const noun = first.kind === "video" || first.kind === "sound file" ? first.kind : "picture";
+  return `Load a ${noun} first: ${first.title}${tail}`;
 }
 
 // "Save Image: exact_name may not ..." names the input it is about, after

js/shared/scrub_input.mjs

@@ -25,10 +25,8 @@
 // Shift's fine step and typed values are never snapped.
 
 import { keepKeyInField } from "./canvas_passthrough.mjs";
-
-// Keep in sync with BRAND in shared/index.mjs - importing it would pull
-// /scripts/app.js into node:test, and this module's math must stay testable.
-const BRAND = "#00b4aa";
+// theme.mjs has no imports, so this module's math stays testable in node:test.
+import { FONT_UI, RADIUS_CONTROL, THEME as T } from "./theme.mjs";
 
 // Horizontal pixels of drag per step; small enough to feel light, large
 // enough that a shaky click cannot change the value. The dead zone keeps a
@@ -181,19 +179,19 @@ function ensureScrubCss() {
   // for one) carry blanket `section input` rules, and these must outrank
   // them wherever the control is mounted.
   style.textContent = `
-  .ausboss-scrub{display:flex;width:72px;height:24px;border:1px solid #3a4047;border-radius:5px;
-    background:#23272c;overflow:hidden;flex:none;color:#d7dde2;font:12px system-ui}
-  .ausboss-scrub:focus-within{border-color:${BRAND}}
+  .ausboss-scrub{display:flex;width:72px;height:24px;border:1px solid transparent;border-radius:${RADIUS_CONTROL}px;
+    background:${T.fill};overflow:hidden;flex:none;color:${T.ink};font:500 12px ${FONT_UI};font-variant-numeric:tabular-nums}
+  .ausboss-scrub:focus-within{border-color:${T.brand}}
   .ausboss-scrub>.ausboss-scrub-input{flex:1 1 auto;min-width:0;width:100%;height:100%;border:none;
     padding:0;margin:0;background:transparent;color:inherit;text-align:center;cursor:ew-resize;
     user-select:none;font:inherit;outline:none;border-radius:0}
   .ausboss-scrub>.ausboss-scrub-input:focus{cursor:text;user-select:text}
-  .ausboss-scrub>.ausboss-scrub-unit{flex:none;align-self:center;padding:0 3px 0 1px;color:#5f7674;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;text-align:center;user-select:none;pointer-events:none}
+  .ausboss-scrub>.ausboss-scrub-unit{flex:none;align-self:center;padding:0 3px 0 1px;color:${T.faint};font:600 10px ${FONT_UI};letter-spacing:.04em;text-transform:uppercase;text-align:center;user-select:none;pointer-events:none}
   .ausboss-scrub>.ausboss-scrub-step{flex:none;width:14px;display:flex;flex-direction:column;
-    border-left:1px solid #3a4047}
+    border-left:1px solid transparent;background:${T.fillHover}}
   .ausboss-scrub>.ausboss-scrub-step>button{flex:1 1 0;min-height:0;border:none;background:transparent;
-    color:#9ba2aa;cursor:pointer;padding:0;margin:0;display:grid;place-items:center;border-radius:0}
-  .ausboss-scrub>.ausboss-scrub-step>button:hover{color:${BRAND};background:rgba(255,255,255,.05)}
+    color:${T.label};cursor:pointer;padding:0;margin:0;display:grid;place-items:center;border-radius:0}
+  .ausboss-scrub>.ausboss-scrub-step>button:hover{color:${T.brand};background:rgba(255,255,255,.05)}
   `;
   document.head.append(style);
 }

js/shared/seed_look.mjs

@@ -0,0 +1,61 @@
+// Seed 🆎's two looks, picked from the gear on its card: the full card
+// (the default), or "compact", one short row with the number, a mode chip
+// and a new-seed button. The look is kept in the node's properties, so the
+// node's inputs, saved values and the prompt it sends are the same in both,
+// and the last look picked is what new Seed nodes start with.
+//
+// Data and decisions only (tests/seed_look.test.mjs); js/seed/index.js
+// draws the card.
+
+export const SEED_LOOK_PROPERTY = "ausboss_seed_look";
+export const SEED_LOOKS = ["full", "compact"];
+export const SEED_LOOK_SCOPE = "seed_look";
+
+export function seedLook(node) {
+  return node?.properties?.[SEED_LOOK_PROPERTY] === "compact" ? "compact" : "full";
+}
+
+// The full card leaves no property behind, so a node set back to it is
+// saved exactly as one that was never changed.
+export function setSeedLook(node, look) {
+  if (!node) return "full";
+  node.properties ??= {};
+  if (look === "compact") node.properties[SEED_LOOK_PROPERTY] = "compact";
+  else delete node.properties[SEED_LOOK_PROPERTY];
+  return seedLook(node);
+}
+
+// The gear menu (js/shared/settings_menu.mjs). The pick is also kept as the
+// look new Seed nodes start with.
+export const SEED_LOOK_MENU = [
+  {
+    key: "look",
+    label: "Look",
+    type: "choice",
+    options: SEED_LOOKS,
+    default: "full",
+    hint: "How this Seed node looks. New Seed nodes start the same way.",
+    optionHints: {
+      full: "the whole card: mode buttons, New seed, Use last run, and the seeds it ran with.",
+      compact: "one short row: the number, a mode chip you tap to change, and a dice for a new seed.",
+    },
+  },
+];
+
+// The compact row's chip: tap to go Random -> Fixed -> Step +1 -> Step -1
+// -> Random. Values are the frontend's control_after_generate choices.
+const CYCLE = ["randomize", "fixed", "increment", "decrement"];
+
+export function nextControl(control) {
+  const index = CYCLE.indexOf(control);
+  return CYCLE[(index + 1) % CYCLE.length] ?? "fixed";
+}
+
+export function controlChip(control) {
+  switch (control) {
+    case "randomize": return { text: "Random", title: "Rolls a new seed after each run. Tap for Fixed." };
+    case "increment": return { text: "+1", title: "Adds 1 after each run. Tap for -1." };
+    case "decrement": return { text: "−1", title: "Takes 1 off after each run. Tap for Random." };
+    default: return { text: "Fixed", title: "Keeps this seed for every run. Tap for +1." };
+  }
+}

js/shared/slide_switch.mjs

@@ -2,7 +2,7 @@
 // chosen one: the mode row of Image Compare A/B, and its off | on choices.
 // The choices share one width, so the marker only has to move. With `fit`
 // each choice is as wide as its own name, and the marker is measured.
-import { BRAND } from "./index.mjs";
+import { FONT_UI, RADIUS_CONTROL, RADIUS_XS, THEME as T } from "./theme.mjs";
 
 const CSS_ID = "ausboss-slide-switch-v1";
 
@@ -11,17 +11,17 @@ function ensureCss() {
   const style = document.createElement("style");
   style.id = CSS_ID;
   style.textContent = `
-.ausboss-slide{position:relative;box-sizing:border-box;flex:none;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;height:24px;padding:2px;border:1px solid #2a3437;border-radius:6px;background:#0f1516;}
+.ausboss-slide{position:relative;box-sizing:border-box;flex:none;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;height:24px;padding:2px;border:1px solid transparent;border-radius:${RADIUS_CONTROL}px;background:${T.fill};}
 .ausboss-slide.fit{grid-auto-columns:max-content;}
 .ausboss-slide.fit button{padding:0 7px;}
-.ausboss-slide-mark{position:absolute;top:2px;bottom:2px;left:2px;border-radius:4px;background:${BRAND};box-shadow:0 0 7px rgba(0,180,170,.3);transition:transform .16s ease,width .16s ease;pointer-events:none;}
+.ausboss-slide-mark{position:absolute;top:2px;bottom:2px;left:2px;border-radius:${RADIUS_XS}px;background:${T.brand};transition:transform .16s ease,width .16s ease;pointer-events:none;}
 .ausboss-slide.none .ausboss-slide-mark{display:none;}
-.ausboss-slide button{position:relative;box-sizing:border-box;min-width:0;height:100%;margin:0;padding:0 9px;border:none;border-radius:4px;background:transparent;color:#8ba3a1;font:700 10px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.02em;white-space:nowrap;cursor:pointer;transition:color .16s ease;}
-.ausboss-slide button:hover{color:#fff;}
-.ausboss-slide button.on,.ausboss-slide button.on:hover{color:#04201d;}
-.ausboss-slide.off-left button.on:first-of-type,.ausboss-slide.off-left button.on:first-of-type:hover{color:#d8eeee;}
-.ausboss-slide.off-left.is-off .ausboss-slide-mark{background:#33423f;box-shadow:none;}
-.ausboss-slide button:focus-visible{outline:1px solid ${BRAND};outline-offset:1px;}
+.ausboss-slide button{position:relative;box-sizing:border-box;min-width:0;height:100%;margin:0;padding:0 9px;border:none;border-radius:${RADIUS_XS}px;background:transparent;color:${T.label};font:600 11px/1 ${FONT_UI};white-space:nowrap;cursor:pointer;transition:color .16s ease;}
+.ausboss-slide button:hover{color:${T.inkHover};}
+.ausboss-slide button.on,.ausboss-slide button.on:hover{color:${T.onBrand};}
+.ausboss-slide.off-left button.on:first-of-type,.ausboss-slide.off-left button.on:first-of-type:hover{color:${T.ink};}
+.ausboss-slide.off-left.is-off .ausboss-slide-mark{background:${T.switchOff};}
+.ausboss-slide button:focus-visible{outline:1px solid ${T.brand};outline-offset:1px;}
 @media (prefers-reduced-motion: reduce){.ausboss-slide-mark,.ausboss-slide button{transition:none;}}
 `;
   document.head.appendChild(style);

js/shared/step_preview.mjs

@@ -9,10 +9,10 @@
 //
 // Runs queued from another workflow tab are left to that tab.
 
-import { api } from "/scripts/api.js";
-import { app } from "/scripts/app.js";
+import { api } from "../../../scripts/api.js";
+import { app } from "../../../scripts/app.js";
 import { nodeByExecutionId } from "./graph_ids.mjs";
-import { BRAND } from "./index.mjs";
+import { FONT_UI, RADIUS_CONTROL, THEME as T } from "./theme.mjs";
 import { outputRecordQuery } from "./input_preview.mjs";
 import { isForeignRun } from "./prompt_scope.mjs";
 import {
@@ -213,15 +213,15 @@ export function ensureStepCss() {
 .ausboss-steps.on{display:block;}
 .ausboss-steps-showing>img,.ausboss-steps-showing>video,.ausboss-steps-showing>.ausboss-input-preview-hint,.ausboss-steps-showing>.ausboss-video-status{visibility:hidden;}
 .ausboss-steps img,.ausboss-steps.on img{display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;object-fit:contain;visibility:visible;}
-.ausboss-steps-line{position:absolute;left:0;top:0;height:3px;width:0;background:${BRAND};box-shadow:0 0 6px rgba(0,180,170,.5);transition:width .15s linear;}
-.ausboss-steps-chip{position:absolute;left:6px;right:6px;bottom:6px;box-sizing:border-box;padding:4px 7px;border:1px solid rgba(255,255,255,.08);border-radius:5px;background:rgba(8,12,13,.84);color:#d8ecea;font:600 10.5px/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
+.ausboss-steps-line{position:absolute;left:0;top:0;height:3px;width:0;background:${T.brand};transition:width .15s linear;}
+.ausboss-steps-chip{position:absolute;left:6px;right:6px;bottom:6px;box-sizing:border-box;padding:4px 7px;border:1px solid transparent;border-radius:${RADIUS_CONTROL}px;background:rgba(21,24,26,.88);color:${T.inkSoft};font:600 10.5px/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
 .ausboss-steps.stopped img{filter:brightness(.55) saturate(.7);}
 .ausboss-steps.stopped .ausboss-steps-line{display:none;}
-.ausboss-steps.stopped .ausboss-steps-chip{border-color:rgba(224,96,90,.55);color:#ffd0cc;}
-.ausboss-steps-hint{position:absolute;left:50%;top:50%;max-width:86%;transform:translate(-50%,-50%);color:#78908e;font:11px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:center;}
-.ausboss-steps-stop{border-color:rgba(224,96,90,.8)!important;background:rgba(58,28,27,.9)!important;color:#ffd9d6!important;}
-.ausboss-steps-stop:hover{background:rgba(120,38,33,.95)!important;color:#fff!important;}
-.ausboss-steps-stop::before{content:"";display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:1px;background:#e0605a;vertical-align:1px;}
+.ausboss-steps.stopped .ausboss-steps-chip{border-color:${T.danger};color:${T.dangerInk};}
+.ausboss-steps-hint{position:absolute;left:50%;top:50%;max-width:86%;transform:translate(-50%,-50%);color:${T.faint};font:11px/1.35 ${FONT_UI};text-align:center;}
+.ausboss-steps-stop{border-color:transparent!important;background:${T.dangerSoft}!important;color:${T.dangerInk}!important;}
+.ausboss-steps-stop:hover{background:rgba(120,38,33,.95)!important;color:${T.inkHover}!important;}
+.ausboss-steps-stop::before{content:"";display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:1px;background:${T.danger};vertical-align:1px;}
 .ausboss-video-tool.ausboss-steps-stop{display:none;}
 .ausboss-video-tool.ausboss-steps-stop.live{display:inline-block;}
 .ausboss-video-stage.is-still .ausboss-video-tools.ausboss-steps-tools{display:flex;}

js/shared/theme.mjs

@@ -0,0 +1,50 @@
+// The pack's node-face palette, in one place. Cards, number boxes and
+// switches read their colours, font and sizes from here instead of
+// carrying their own literals.
+//
+// The look: solid gray controls with no outlines on a near-black card,
+// neutral grays, and one teal accent for whatever is on or picked.
+//
+// No imports on purpose: scrub_input.mjs and the node:test suites load
+// this file without the ComfyUI app.
+
+export const THEME = Object.freeze({
+  brand: "#00b4aa",          // the one accent: picked segment, switch on, focus ring
+  onBrand: "#04201d",        // text on a brand fill
+  brandSoft: "rgba(0,180,170,.16)", // chip fill
+  brandSoftHover: "rgba(0,180,170,.26)",
+  brandInk: "#45d6cb",       // chip text on brandSoft
+  brandGlow: "#6fe0d6",      // the big text look
+
+  card: "#101214",           // widget card ground
+  fill: "#2d3134",           // every control: solid, no border
+  fillHover: "#383c40",      // control hover, the chevron column
+  well: "#0f1112",           // picture stage ground
+  rule: "#2b2f32",           // hairline after a section label
+  switchOff: "#62676d",      // the mark of a switch sitting on off
+
+  ink: "#f6f7f8",            // values: numbers, picked options, typed text
+  inkSoft: "#e0e3e5",        // default card text
+  inkHover: "#ffffff",
+  label: "#b4b9bd",          // row labels, unselected segments, chevrons
+  faint: "#979da2",          // units, section labels, placeholders, muted rows
+
+  danger: "#e0605a",         // stop: the dot on the Stop button
+  dangerInk: "#ffd9d6",
+  dangerSoft: "#3a1c1b",
+
+  warn: "#e0a040",
+  warnInk: "#ffdca8",
+  warnSoft: "#3a2a10",
+});
+
+export const FONT_UI = `system-ui,-apple-system,"Segoe UI",Roboto,sans-serif`;
+
+// Every control in a card row is as tall as the row.
+export const CONTROL_HEIGHT = 26;
+export const RADIUS_XS = 4;
+export const RADIUS_CONTROL = 6;
+export const RADIUS_CARD = 10;
+
+// The select's chevron, drawn in `label`.
+export const SELECT_CHEVRON = `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23b4b9bd' stroke-width='1.5'/%3E%3C/svg%3E")`;

js/shared/tile_face.mjs

@@ -0,0 +1,207 @@
+import { app } from "../../../scripts/app.js";
+
+// Classic paints the node behind the DOM widget. Override only drawing properties
+// on this instance so saved colors, titles and the node type remain usable.
+const originalDescriptors = new WeakMap();
+
+export function setTileFace(node, root, enabled, onEdit) {
+  root.classList.toggle("ausboss-tile-face", enabled);
+  const previous = originalDescriptors.get(node);
+  if (enabled === Boolean(previous)) return;
+  if (enabled) {
+    const properties = {
+      title_mode: () => globalThis.LiteGraph?.NO_TITLE ?? 1,
+      renderingBgColor: () => "transparent",
+      drawBadges: () => skipBadges,
+    };
+    const descriptors = new Map();
+    for (const [key, get] of Object.entries(properties)) {
+      const own = Object.getOwnPropertyDescriptor(node, key);
+      descriptors.set(key, own);
+      Object.defineProperty(node, key, {
+        configurable: true,
+        get() {
+          if (!node.flags?.collapsed) return get();
+          if (own) return own.get ? own.get.call(node) : own.value;
+          return Reflect.get(Object.getPrototypeOf(node), key, node);
+        },
+      });
+    }
+    const listeners = new AbortController();
+    installTileDrag(node, root, listeners.signal, onEdit);
+    installTileResize(node, root, listeners.signal);
+    originalDescriptors.set(node, { descriptors, listeners });
+  } else {
+    previous.listeners.abort();
+    for (const [key, descriptor] of previous.descriptors) {
+      if (descriptor) Object.defineProperty(node, key, descriptor);
+      else delete node[key];
+    }
+    originalDescriptors.delete(node);
+  }
+  node.setDirtyCanvas?.(true, true);
+}
+
+function skipBadges() {}
+
+// A normal node moves by its header. Give the tile that gesture while
+// keeping a short click on a link or the info button as its usual action.
+function installTileDrag(node, root, signal, onEdit) {
+  let press;
+  let lastClick;
+  let suppressClick = false;
+  const capture = { capture: true, signal };
+  root.addEventListener("pointerdown", (event) => {
+    suppressClick = false;
+    if (!event.isPrimary || event.button !== 0 || node.pinned || app.canvas?.read_only) return;
+    if (event.target.closest(".ausboss-callout-editor,.ausboss-callout-tools,.ausboss-note-edit,.ausboss-tile-resize")) return;
+    if (onEdit && !event.target.closest("a,button") && lastClick
+      && event.timeStamp - lastClick.time < 500
+      && Math.hypot(event.clientX - lastClick.x, event.clientY - lastClick.y) < 8) {
+      lastClick = null;
+      event.preventDefault();
+      event.stopPropagation();
+      onEdit();
+      return;
+    }
+    press = { id: event.pointerId, x: event.clientX, y: event.clientY, moving: false };
+    const target = event.target.closest("a,button") || root;
+    target.setPointerCapture(event.pointerId);
+    event.stopPropagation();
+  }, capture);
+  root.addEventListener("pointermove", (event) => {
+    if (event.pointerId !== press?.id) return;
+    const dx = event.clientX - press.x;
+    const dy = event.clientY - press.y;
+    if (!press.moving) {
+      if (Math.hypot(dx, dy) < 5) return;
+      press.moving = true;
+      node.graph?.beforeChange?.();
+      if (!node.selected) app.canvas?.selectNode?.(node, event.shiftKey);
+      const selected = Array.from(app.canvas?.selectedItems ?? []);
+      press.starts = (selected.includes(node) ? selected : [node])
+        .filter(item => item.pos && !item.pinned)
+        .map(item => ({ item, x: item.pos[0], y: item.pos[1] }));
+    }
+    const zoom = app.canvas?.ds?.scale || 1;
+    for (const start of press.starts) start.item.pos = [start.x + dx / zoom, start.y + dy / zoom];
+    node.setDirtyCanvas?.(true, true);
+    event.stopPropagation();
+  }, capture);
+  const finish = (event) => {
+    if (event.pointerId !== press?.id) return;
+    if (press.moving) {
+      node.graph?.afterChange?.();
+      suppressClick = true;
+      lastClick = null;
+    } else {
+      lastClick = { time: event.timeStamp, x: event.clientX, y: event.clientY };
+    }
+    press = null;
+  };
+  root.addEventListener("pointerup", finish, capture);
+  root.addEventListener("lostpointercapture", finish, capture);
+  root.addEventListener("click", (event) => {
+    if (suppressClick) {
+      event.preventDefault();
+      event.stopImmediatePropagation();
+      suppressClick = false;
+    } else if (!event.target.closest("a,button,.ausboss-callout-editor")) {
+      app.canvas?.selectNode?.(node, event.shiftKey);
+    }
+  }, capture);
+  root.addEventListener("dragstart", (event) => {
+    if (press) event.preventDefault();
+  }, { signal });
+  root.addEventListener("contextmenu", (event) => {
+    if (event.target.closest("textarea,input")) return;
+    event.preventDefault();
+    event.stopPropagation();
+    app.canvas?.processContextMenu?.(node, event);
+  }, { signal });
+}
+
+// Put the resize target on the visible corner. The native node corner lies
+// outside a frameless tile and is almost impossible to find without a frame.
+function installTileResize(node, root, signal) {
+  const face = root.querySelector(".ausboss-callout-card,.ausboss-note-card") || root;
+  const grip = document.createElement("button");
+  grip.type = "button";
+  grip.className = "ausboss-tile-resize";
+  grip.setAttribute("aria-label", "Resize tile");
+  grip.title = "Drag to resize. Arrow keys resize; Shift makes smaller changes.";
+  face.append(grip);
+  let drag;
+  const minimum = () => {
+    // Use the same floor as the native corner, including widget margins.
+    // Older saved tiles can be smaller: touching their grip must not jump.
+    const floor = node.computeSize?.() ?? [200, 72];
+    return floor.map((value, axis) => Math.min(value, node.size[axis]));
+  };
+  const resize = (width, height, floor) => {
+    node.setSize?.([Math.max(floor[0], width), Math.max(floor[1], height)]);
+    node.setDirtyCanvas?.(true, true);
+  };
+  grip.addEventListener("pointerdown", event => {
+    event.stopPropagation();
+    if (event.button !== 0 || node.pinned || app.canvas?.read_only) return;
+    event.preventDefault();
+    node.graph?.beforeChange?.();
+    app.canvas?.selectNode?.(node);
+    drag = { id: event.pointerId, x: event.clientX, y: event.clientY,
+      size: [...node.size], floor: minimum(), zoom: app.canvas?.ds?.scale || 1 };
+    grip.setPointerCapture(event.pointerId);
+  });
+  grip.addEventListener("pointermove", event => {
+    if (event.pointerId !== drag?.id) return;
+    event.stopPropagation();
+    resize(drag.size[0] + (event.clientX - drag.x) / drag.zoom,
+      drag.size[1] + (event.clientY - drag.y) / drag.zoom, drag.floor);
+  });
+  const finish = event => {
+    if (event.pointerId !== drag?.id) return;
+    drag = null;
+    node.graph?.afterChange?.();
+  };
+  grip.addEventListener("pointerup", finish);
+  grip.addEventListener("pointercancel", finish);
+  grip.addEventListener("lostpointercapture", finish);
+  grip.addEventListener("click", event => { event.preventDefault(); event.stopPropagation(); });
+  grip.addEventListener("keydown", event => {
+    if (!event.key.startsWith("Arrow")) return;
+    event.preventDefault();
+    event.stopPropagation();
+    if (node.pinned || app.canvas?.read_only) return;
+    const step = event.shiftKey ? 1 : 10;
+    node.graph?.beforeChange?.();
+    resize(node.size[0] + (event.key === "ArrowRight" ? step : event.key === "ArrowLeft" ? -step : 0),
+      node.size[1] + (event.key === "ArrowDown" ? step : event.key === "ArrowUp" ? -step : 0), minimum());
+    node.graph?.afterChange?.();
+  });
+  signal.addEventListener("abort", () => { if (drag) node.graph?.afterChange?.(); grip.remove(); }, { once: true });
+}
+
+// Nodes 2.0 always adds a title's height to --node-height, even when a tile
+// hides the title. Remove that unused reservation: otherwise an 88px saved
+// tile gains a 30px tail and overlaps the next tile. Vue also positions the
+// host at saved y minus the title height. Restore that headerless origin
+// with an independent translation so faces cannot cover group headings.
+// Keep the saved size and
+// the native selection/resize targets, rather than changing the graph.
+// Its in-body pack badges also consume 20px that Classic paints outside the
+// panel. Decorative tiles and callouts use that room for their own face.
+// The node-body test id and direct mt-auto badge wrapper are from the pinned
+// frontend's LGraphNode.vue/NodeBadges.vue; no other node body is affected.
+export const TILE_FACE_CSS = `
+.ausboss-tile-face :is(.ausboss-callout-card,.ausboss-note-head){pointer-events:auto;touch-action:none;cursor:grab;}
+.ausboss-tile-face{user-select:none;}
+.ausboss-tile-resize{position:absolute;right:1px;bottom:1px;z-index:4;width:22px;height:22px;padding:0;border:0;border-radius:3px;background:transparent;color:#9fb9b6;opacity:.65;cursor:nwse-resize;touch-action:none;pointer-events:auto;}
+.ausboss-tile-resize::after{content:"";position:absolute;right:4px;bottom:4px;width:9px;height:9px;background:repeating-linear-gradient(135deg,transparent 0 3px,currentColor 3px 4px,transparent 4px 6px);clip-path:polygon(100% 0,100% 100%,0 100%);}
+.ausboss-tile-resize:hover,.ausboss-tile-resize:focus-visible{opacity:1;background:#00b4aa33;outline:1px solid #00b4aa;outline-offset:-1px;}
+.lg-node:has(.ausboss-tile-face){filter:none;}
+.lg-node:has(.ausboss-tile-face):not([data-collapsed]){min-height:calc(var(--node-height) - ${globalThis.LiteGraph?.NODE_TITLE_HEIGHT ?? 30}px);translate:0 ${globalThis.LiteGraph?.NODE_TITLE_HEIGHT ?? 30}px;}
+.lg-node:has(.ausboss-tile-face,.ausboss-callout) [data-testid^="node-body-"]>.mt-auto{display:none;}
+.lg-node:has(.ausboss-tile-face) [data-testid="node-inner-wrapper"],
+.lg-node:has(.ausboss-tile-face) .bg-component-node-background{background:transparent!important;box-shadow:none;}
+.lg-node:has(.ausboss-tile-face) .lg-node-header{display:none;}
+`;

js/shared/timeline_math.mjs

@@ -128,8 +128,9 @@ export function fixedFrameWindow(info, first, frames, outputFps) {
   const tooLong = seconds > duration + 1e-7;
   const span = Math.max(1, Math.ceil(seconds * info.fps - 1e-7));
   const latest = Math.max(0, Math.floor((duration - seconds) * info.fps + 1e-7));
-  const head = clamp(Math.round(finite(first)), 0, Math.min(latest, Math.max(0, info.count - span)));
-  return { first: head, last: Math.min(info.count - 1, head + span - 1), frames: count, seconds, tooLong };
+  const latestStart = Math.min(latest, Math.max(0, info.count - span));
+  const head = clamp(Math.round(finite(first)), 0, latestStart);
+  return { first: head, last: Math.min(info.count - 1, head + span - 1), frames: count, seconds, tooLong, latestStart };
 }
 
 // What a run keeps out of the window after thinning, the cap and the snap
@@ -243,13 +244,28 @@ export function clipLengthPlan(info, values = {}) {
   const exact = (frames) => {
     const fixed = fixedFrameWindow(info, window.first, frames, values.outputFps === undefined ? info.fps / nth : values.outputFps);
     if (!fixed || fixed.unresolved) return { ...base, requested: frames };
-    return { ...base, first: fixed.first, last: fixed.last, windowLast: fixed.last, frames: fixed.frames, requested: frames, tooLong: fixed.tooLong };
+    return { ...base, first: fixed.first, last: fixed.last, windowLast: fixed.last, frames: fixed.frames, requested: frames, latestStart: fixed.latestStart, tooLong: fixed.tooLong };
   };
   const capped = (cap) => {
     const requested = cap > 0 ? snapFrameCount(cap, snap) : null;
-    if (values.resampled) return { ...base, last: cap > 0 ? null : window.last, requested };
+    // Limit edits to IN, never the stored start. A shared workflow may
+    // intentionally open with a shorter tail. The whole locked count must
+    // fit before the source end or an earlier saved/wired OUT.
+    const endFrame = frameWindow(info, 0, values.end).last;
+    let latestStart = null;
+    if (requested != null) {
+      if (!values.resampled) {
+        latestStart = Math.max(0, endFrame - lastFrameFor(0, requested, nth));
+      } else if (values.outputFps > 0) {
+        const duration = info.duration || info.count / info.fps;
+        const end = values.end > 0 ? Math.min(values.end, duration) : duration;
+        const lastTick = (requested - 1) / values.outputFps;
+        latestStart = clamp(Math.floor((end - lastTick - TRIM_EPSILON) * info.fps), 0, endFrame);
+      }
+    }
+    if (values.resampled) return { ...base, last: cap > 0 ? null : window.last, requested, latestStart };
     const kept = keptFrames(window, nth, cap, snap);
-    return { ...base, last: kept.lastKept, frames: kept.frames, requested, truncated: requested != null && kept.frames < requested };
+    return { ...base, last: kept.lastKept, frames: kept.frames, requested, latestStart, truncated: requested != null && kept.frames < requested };
   };
   const stored = Math.max(0, Math.trunc(finite(values.maxFrames)));
   if (mode === "fixed") return exact(Math.trunc(finite(values.fixedFrames)));