hyperframes 0.4.7 → 0.4.8

package/dist/cli.js

@@ -54,7 +54,7 @@ var VERSION;
 var init_version = __esm({
   "src/version.ts"() {
     "use strict";
-    VERSION = true ? "0.4.7" : "0.0.0-dev";
+    VERSION = true ? "0.4.8" : "0.0.0-dev";
   }
 });
 
@@ -3479,6 +3479,7 @@ var init_media = __esm({
         const timedTagPositions = [];
         for (const tag of tags) {
           if (tag.name === "video" || tag.name === "audio") continue;
+          if (readAttr(tag.raw, "data-composition-id")) continue;
           if (readAttr(tag.raw, "data-start")) {
             timedTagPositions.push({
               name: tag.name,
@@ -4695,7 +4696,7 @@ var init_hyperframeLinter = __esm({
 });
 
 // ../core/src/compiler/rewriteSubCompPaths.ts
-import { join, resolve, dirname } from "path";
+import { posix } from "path";
 function isAbsoluteOrSpecial(val) {
   return !val || val.startsWith("http://") || val.startsWith("https://") || val.startsWith("//") || val.startsWith("data:") || val.startsWith("#");
 }
@@ -4736,10 +4737,11 @@ function rewriteCssAssetUrls(cssText, compSrcPath) {
     return `url(${quote || ""}${rewritten}${quote || ""})`;
   });
 }
-var PATH_ATTRS, CSS_URL_RE;
+var join, resolve, dirname, PATH_ATTRS, CSS_URL_RE;
 var init_rewriteSubCompPaths = __esm({
   "../core/src/compiler/rewriteSubCompPaths.ts"() {
     "use strict";
+    ({ join, resolve, dirname } = posix);
     PATH_ATTRS = ["src", "href"];
     CSS_URL_RE = /\burl\(\s*(["']?)([^)"']+)\1\s*\)/g;
   }
@@ -15167,7 +15169,7 @@ var init_facades = __esm({
 });
 
 // ../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/element.js
-var Level0, level0, HTMLElement;
+var Level0, level0, HTMLElement2;
 var init_element3 = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/element.js"() {
     "use strict";
@@ -15192,7 +15194,7 @@ var init_element3 = __esm({
           element.addEventListener(type, value, false);
       }
     };
-    HTMLElement = class extends Element2 {
+    HTMLElement2 = class extends Element2 {
       static get observedAttributes() {
         return [];
       }
@@ -15730,7 +15732,7 @@ var init_template_element = __esm({
     init_register_html_class();
     init_element3();
     tagName = "template";
-    HTMLTemplateElement = class extends HTMLElement {
+    HTMLTemplateElement = class extends HTMLElement2 {
       constructor(ownerDocument) {
         super(ownerDocument, tagName);
         const content = this.ownerDocument.createDocumentFragment();
@@ -15754,7 +15756,7 @@ var init_html_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/html-element.js"() {
     "use strict";
     init_element3();
-    HTMLHtmlElement = class extends HTMLElement {
+    HTMLHtmlElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "html") {
         super(ownerDocument, localName);
       }
@@ -15768,8 +15770,8 @@ var init_text_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/text-element.js"() {
     "use strict";
     init_element3();
-    ({ toString } = HTMLElement.prototype);
-    TextElement = class extends HTMLElement {
+    ({ toString } = HTMLElement2.prototype);
+    TextElement = class extends HTMLElement2 {
       get innerHTML() {
         return this.textContent;
       }
@@ -15862,7 +15864,7 @@ var init_frame_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/frame-element.js"() {
     "use strict";
     init_element3();
-    HTMLFrameElement = class extends HTMLElement {
+    HTMLFrameElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "frame") {
         super(ownerDocument, localName);
       }
@@ -15879,7 +15881,7 @@ var init_i_frame_element = __esm({
     init_attributes();
     init_element3();
     tagName3 = "iframe";
-    HTMLIFrameElement = class extends HTMLElement {
+    HTMLIFrameElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName3) {
         super(ownerDocument, localName);
       }
@@ -15938,7 +15940,7 @@ var init_object_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/object-element.js"() {
     "use strict";
     init_element3();
-    HTMLObjectElement = class extends HTMLElement {
+    HTMLObjectElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "object") {
         super(ownerDocument, localName);
       }
@@ -15952,7 +15954,7 @@ var init_head_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/head-element.js"() {
     "use strict";
     init_element3();
-    HTMLHeadElement = class extends HTMLElement {
+    HTMLHeadElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "head") {
         super(ownerDocument, localName);
       }
@@ -15966,7 +15968,7 @@ var init_body_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/body-element.js"() {
     "use strict";
     init_element3();
-    HTMLBodyElement = class extends HTMLElement {
+    HTMLBodyElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "body") {
         super(ownerDocument, localName);
       }
@@ -17547,7 +17549,7 @@ var init_time_element = __esm({
     init_attributes();
     init_register_html_class();
     init_element3();
-    HTMLTimeElement = class extends HTMLElement {
+    HTMLTimeElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "time") {
         super(ownerDocument, localName);
       }
@@ -17571,7 +17573,7 @@ var init_field_set_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/field-set-element.js"() {
     "use strict";
     init_element3();
-    HTMLFieldSetElement = class extends HTMLElement {
+    HTMLFieldSetElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "fieldset") {
         super(ownerDocument, localName);
       }
@@ -17585,7 +17587,7 @@ var init_embed_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/embed-element.js"() {
     "use strict";
     init_element3();
-    HTMLEmbedElement = class extends HTMLElement {
+    HTMLEmbedElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "embed") {
         super(ownerDocument, localName);
       }
@@ -17599,7 +17601,7 @@ var init_hr_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/hr-element.js"() {
     "use strict";
     init_element3();
-    HTMLHRElement = class extends HTMLElement {
+    HTMLHRElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "hr") {
         super(ownerDocument, localName);
       }
@@ -17613,7 +17615,7 @@ var init_progress_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/progress-element.js"() {
     "use strict";
     init_element3();
-    HTMLProgressElement = class extends HTMLElement {
+    HTMLProgressElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "progress") {
         super(ownerDocument, localName);
       }
@@ -17627,7 +17629,7 @@ var init_paragraph_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/paragraph-element.js"() {
     "use strict";
     init_element3();
-    HTMLParagraphElement = class extends HTMLElement {
+    HTMLParagraphElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "p") {
         super(ownerDocument, localName);
       }
@@ -17641,7 +17643,7 @@ var init_table_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/table-element.js"() {
     "use strict";
     init_element3();
-    HTMLTableElement = class extends HTMLElement {
+    HTMLTableElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "table") {
         super(ownerDocument, localName);
       }
@@ -17655,7 +17657,7 @@ var init_frame_set_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/frame-set-element.js"() {
     "use strict";
     init_element3();
-    HTMLFrameSetElement = class extends HTMLElement {
+    HTMLFrameSetElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "frameset") {
         super(ownerDocument, localName);
       }
@@ -17669,7 +17671,7 @@ var init_li_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/li-element.js"() {
     "use strict";
     init_element3();
-    HTMLLIElement = class extends HTMLElement {
+    HTMLLIElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "li") {
         super(ownerDocument, localName);
       }
@@ -17683,7 +17685,7 @@ var init_base_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/base-element.js"() {
     "use strict";
     init_element3();
-    HTMLBaseElement = class extends HTMLElement {
+    HTMLBaseElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "base") {
         super(ownerDocument, localName);
       }
@@ -17697,7 +17699,7 @@ var init_data_list_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/data-list-element.js"() {
     "use strict";
     init_element3();
-    HTMLDataListElement = class extends HTMLElement {
+    HTMLDataListElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "datalist") {
         super(ownerDocument, localName);
       }
@@ -17714,7 +17716,7 @@ var init_input_element = __esm({
     init_attributes();
     init_element3();
     tagName5 = "input";
-    HTMLInputElement = class extends HTMLElement {
+    HTMLInputElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName5) {
         super(ownerDocument, localName);
       }
@@ -17767,7 +17769,7 @@ var init_param_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/param-element.js"() {
     "use strict";
     init_element3();
-    HTMLParamElement = class extends HTMLElement {
+    HTMLParamElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "param") {
         super(ownerDocument, localName);
       }
@@ -17781,7 +17783,7 @@ var init_media_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/media-element.js"() {
     "use strict";
     init_element3();
-    HTMLMediaElement = class extends HTMLElement {
+    HTMLMediaElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "media") {
         super(ownerDocument, localName);
       }
@@ -17795,7 +17797,7 @@ var init_audio_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/audio-element.js"() {
     "use strict";
     init_element3();
-    HTMLAudioElement = class extends HTMLElement {
+    HTMLAudioElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "audio") {
         super(ownerDocument, localName);
       }
@@ -17811,7 +17813,7 @@ var init_heading_element = __esm({
     init_register_html_class();
     init_element3();
     tagName6 = "h1";
-    HTMLHeadingElement = class extends HTMLElement {
+    HTMLHeadingElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName6) {
         super(ownerDocument, localName);
       }
@@ -17826,7 +17828,7 @@ var init_directory_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/directory-element.js"() {
     "use strict";
     init_element3();
-    HTMLDirectoryElement = class extends HTMLElement {
+    HTMLDirectoryElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "dir") {
         super(ownerDocument, localName);
       }
@@ -17840,7 +17842,7 @@ var init_quote_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/quote-element.js"() {
     "use strict";
     init_element3();
-    HTMLQuoteElement = class extends HTMLElement {
+    HTMLQuoteElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "quote") {
         super(ownerDocument, localName);
       }
@@ -17894,7 +17896,7 @@ var init_canvas_element = __esm({
     init_element3();
     ({ createCanvas } = import_canvas.default);
     tagName7 = "canvas";
-    HTMLCanvasElement = class extends HTMLElement {
+    HTMLCanvasElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName7) {
         super(ownerDocument, localName);
         this[IMAGE] = createCanvas(300, 150);
@@ -17930,7 +17932,7 @@ var init_legend_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/legend-element.js"() {
     "use strict";
     init_element3();
-    HTMLLegendElement = class extends HTMLElement {
+    HTMLLegendElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "legend") {
         super(ownerDocument, localName);
       }
@@ -17947,7 +17949,7 @@ var init_option_element = __esm({
     init_attributes();
     init_register_html_class();
     tagName8 = "option";
-    HTMLOptionElement = class extends HTMLElement {
+    HTMLOptionElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName8) {
         super(ownerDocument, localName);
       }
@@ -17979,7 +17981,7 @@ var init_span_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/span-element.js"() {
     "use strict";
     init_element3();
-    HTMLSpanElement = class extends HTMLElement {
+    HTMLSpanElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "span") {
         super(ownerDocument, localName);
       }
@@ -17993,7 +17995,7 @@ var init_meter_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/meter-element.js"() {
     "use strict";
     init_element3();
-    HTMLMeterElement = class extends HTMLElement {
+    HTMLMeterElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "meter") {
         super(ownerDocument, localName);
       }
@@ -18007,7 +18009,7 @@ var init_video_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/video-element.js"() {
     "use strict";
     init_element3();
-    HTMLVideoElement = class extends HTMLElement {
+    HTMLVideoElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "video") {
         super(ownerDocument, localName);
       }
@@ -18021,7 +18023,7 @@ var init_table_cell_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/table-cell-element.js"() {
     "use strict";
     init_element3();
-    HTMLTableCellElement = class extends HTMLElement {
+    HTMLTableCellElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "td") {
         super(ownerDocument, localName);
       }
@@ -18052,7 +18054,7 @@ var init_output_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/output-element.js"() {
     "use strict";
     init_element3();
-    HTMLOutputElement = class extends HTMLElement {
+    HTMLOutputElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "output") {
         super(ownerDocument, localName);
       }
@@ -18066,7 +18068,7 @@ var init_table_row_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/table-row-element.js"() {
     "use strict";
     init_element3();
-    HTMLTableRowElement = class extends HTMLElement {
+    HTMLTableRowElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "tr") {
         super(ownerDocument, localName);
       }
@@ -18080,7 +18082,7 @@ var init_data_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/data-element.js"() {
     "use strict";
     init_element3();
-    HTMLDataElement = class extends HTMLElement {
+    HTMLDataElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "data") {
         super(ownerDocument, localName);
       }
@@ -18094,7 +18096,7 @@ var init_menu_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/menu-element.js"() {
     "use strict";
     init_element3();
-    HTMLMenuElement = class extends HTMLElement {
+    HTMLMenuElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "menu") {
         super(ownerDocument, localName);
       }
@@ -18112,7 +18114,7 @@ var init_select_element = __esm({
     init_element3();
     init_node_list();
     tagName10 = "select";
-    HTMLSelectElement = class extends HTMLElement {
+    HTMLSelectElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName10) {
         super(ownerDocument, localName);
       }
@@ -18156,7 +18158,7 @@ var init_br_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/br-element.js"() {
     "use strict";
     init_element3();
-    HTMLBRElement = class extends HTMLElement {
+    HTMLBRElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "br") {
         super(ownerDocument, localName);
       }
@@ -18173,7 +18175,7 @@ var init_button_element = __esm({
     init_attributes();
     init_element3();
     tagName11 = "button";
-    HTMLButtonElement = class extends HTMLElement {
+    HTMLButtonElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName11) {
         super(ownerDocument, localName);
       }
@@ -18208,7 +18210,7 @@ var init_map_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/map-element.js"() {
     "use strict";
     init_element3();
-    HTMLMapElement = class extends HTMLElement {
+    HTMLMapElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "map") {
         super(ownerDocument, localName);
       }
@@ -18222,7 +18224,7 @@ var init_opt_group_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/opt-group-element.js"() {
     "use strict";
     init_element3();
-    HTMLOptGroupElement = class extends HTMLElement {
+    HTMLOptGroupElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "optgroup") {
         super(ownerDocument, localName);
       }
@@ -18236,7 +18238,7 @@ var init_d_list_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/d-list-element.js"() {
     "use strict";
     init_element3();
-    HTMLDListElement = class extends HTMLElement {
+    HTMLDListElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "dl") {
         super(ownerDocument, localName);
       }
@@ -18300,7 +18302,7 @@ var init_font_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/font-element.js"() {
     "use strict";
     init_element3();
-    HTMLFontElement = class extends HTMLElement {
+    HTMLFontElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "font") {
         super(ownerDocument, localName);
       }
@@ -18314,7 +18316,7 @@ var init_div_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/div-element.js"() {
     "use strict";
     init_element3();
-    HTMLDivElement = class extends HTMLElement {
+    HTMLDivElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "div") {
         super(ownerDocument, localName);
       }
@@ -18331,7 +18333,7 @@ var init_link_element = __esm({
     init_attributes();
     init_element3();
     tagName13 = "link";
-    HTMLLinkElement = class extends HTMLElement {
+    HTMLLinkElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName13) {
         super(ownerDocument, localName);
       }
@@ -18387,7 +18389,7 @@ var init_slot_element = __esm({
     init_element3();
     init_register_html_class();
     tagName14 = "slot";
-    HTMLSlotElement = class extends HTMLElement {
+    HTMLSlotElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName14) {
         super(ownerDocument, localName);
       }
@@ -18438,7 +18440,7 @@ var init_form_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/form-element.js"() {
     "use strict";
     init_element3();
-    HTMLFormElement = class extends HTMLElement {
+    HTMLFormElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "form") {
         super(ownerDocument, localName);
       }
@@ -18455,7 +18457,7 @@ var init_image_element = __esm({
     init_attributes();
     init_element3();
     tagName15 = "img";
-    HTMLImageElement = class extends HTMLElement {
+    HTMLImageElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName15) {
         super(ownerDocument, localName);
       }
@@ -18514,7 +18516,7 @@ var init_pre_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/pre-element.js"() {
     "use strict";
     init_element3();
-    HTMLPreElement = class extends HTMLElement {
+    HTMLPreElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "pre") {
         super(ownerDocument, localName);
       }
@@ -18528,7 +18530,7 @@ var init_u_list_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/u-list-element.js"() {
     "use strict";
     init_element3();
-    HTMLUListElement = class extends HTMLElement {
+    HTMLUListElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "ul") {
         super(ownerDocument, localName);
       }
@@ -18545,7 +18547,7 @@ var init_meta_element = __esm({
     init_register_html_class();
     init_attributes();
     tagName16 = "meta";
-    HTMLMetaElement = class extends HTMLElement {
+    HTMLMetaElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName16) {
         super(ownerDocument, localName);
       }
@@ -18592,7 +18594,7 @@ var init_picture_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/picture-element.js"() {
     "use strict";
     init_element3();
-    HTMLPictureElement = class extends HTMLElement {
+    HTMLPictureElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "picture") {
         super(ownerDocument, localName);
       }
@@ -18606,7 +18608,7 @@ var init_area_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/area-element.js"() {
     "use strict";
     init_element3();
-    HTMLAreaElement = class extends HTMLElement {
+    HTMLAreaElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "area") {
         super(ownerDocument, localName);
       }
@@ -18620,7 +18622,7 @@ var init_o_list_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/o-list-element.js"() {
     "use strict";
     init_element3();
-    HTMLOListElement = class extends HTMLElement {
+    HTMLOListElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "ol") {
         super(ownerDocument, localName);
       }
@@ -18634,7 +18636,7 @@ var init_table_caption_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/table-caption-element.js"() {
     "use strict";
     init_element3();
-    HTMLTableCaptionElement = class extends HTMLElement {
+    HTMLTableCaptionElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "caption") {
         super(ownerDocument, localName);
       }
@@ -18651,7 +18653,7 @@ var init_anchor_element = __esm({
     init_attributes();
     init_element3();
     tagName17 = "a";
-    HTMLAnchorElement = class extends HTMLElement {
+    HTMLAnchorElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName17) {
         super(ownerDocument, localName);
       }
@@ -18699,7 +18701,7 @@ var init_label_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/label-element.js"() {
     "use strict";
     init_element3();
-    HTMLLabelElement = class extends HTMLElement {
+    HTMLLabelElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "label") {
         super(ownerDocument, localName);
       }
@@ -18713,7 +18715,7 @@ var init_unknown_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/unknown-element.js"() {
     "use strict";
     init_element3();
-    HTMLUnknownElement = class extends HTMLElement {
+    HTMLUnknownElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "unknown") {
         super(ownerDocument, localName);
       }
@@ -18727,7 +18729,7 @@ var init_mod_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/mod-element.js"() {
     "use strict";
     init_element3();
-    HTMLModElement = class extends HTMLElement {
+    HTMLModElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "mod") {
         super(ownerDocument, localName);
       }
@@ -18741,7 +18743,7 @@ var init_details_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/details-element.js"() {
     "use strict";
     init_element3();
-    HTMLDetailsElement = class extends HTMLElement {
+    HTMLDetailsElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "details") {
         super(ownerDocument, localName);
       }
@@ -18758,7 +18760,7 @@ var init_source_element = __esm({
     init_attributes();
     init_element3();
     tagName18 = "source";
-    HTMLSourceElement = class extends HTMLElement {
+    HTMLSourceElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = tagName18) {
         super(ownerDocument, localName);
       }
@@ -18799,7 +18801,7 @@ var init_track_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/track-element.js"() {
     "use strict";
     init_element3();
-    HTMLTrackElement = class extends HTMLElement {
+    HTMLTrackElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "track") {
         super(ownerDocument, localName);
       }
@@ -18813,7 +18815,7 @@ var init_marquee_element = __esm({
   "../../node_modules/.bun/linkedom@0.18.12/node_modules/linkedom/esm/html/marquee-element.js"() {
     "use strict";
     init_element3();
-    HTMLMarqueeElement = class extends HTMLElement {
+    HTMLMarqueeElement = class extends HTMLElement2 {
       constructor(ownerDocument, localName = "marquee") {
         super(ownerDocument, localName);
       }
@@ -18895,7 +18897,7 @@ var init_html_classes = __esm({
     init_track_element();
     init_marquee_element();
     HTMLClasses = {
-      HTMLElement,
+      HTMLElement: HTMLElement2,
       HTMLTemplateElement,
       HTMLHtmlElement,
       HTMLScriptElement,
@@ -19526,7 +19528,7 @@ var init_document2 = __esm({
           return element;
         }
       }
-      return new HTMLElement(ownerDocument, localName);
+      return new HTMLElement2(ownerDocument, localName);
     };
     HTMLDocument = class extends Document2 {
       constructor() {
@@ -20804,6 +20806,13 @@ async function initTransparentBackground(page) {
   await client.send("Emulation.setDefaultBackgroundColorOverride", {
     color: { r: 0, g: 0, b: 0, a: 0 }
   });
+  await page.evaluate((styleId) => {
+    if (document.getElementById(styleId)) return;
+    const style = document.createElement("style");
+    style.id = styleId;
+    style.textContent = "html,body,[data-composition-id]{background:transparent !important;background-color:transparent !important;background-image:none !important;}";
+    document.head.appendChild(style);
+  }, TRANSPARENT_BG_STYLE_ID);
 }
 async function captureAlphaPng(page, width, height) {
   const client = await getCdpSession(page);
@@ -20817,6 +20826,56 @@ async function captureAlphaPng(page, width, height) {
   });
   return Buffer.from(result.data, "base64");
 }
+async function applyDomLayerMask(page, showIds, extraHideIds) {
+  await page.evaluate(
+    (args) => {
+      const existing = document.getElementById(args.styleId);
+      if (existing) existing.remove();
+      const showSelectors = [];
+      for (const id of args.show) {
+        const escaped = CSS.escape(id);
+        showSelectors.push(`#${escaped}`, `#${escaped} *`);
+        const renderEscaped = CSS.escape(`__render_frame_${id}__`);
+        showSelectors.push(`#${renderEscaped}`, `#${renderEscaped} *`);
+      }
+      const massHideRule = "body *{visibility:hidden !important;}";
+      const showRule = showSelectors.length === 0 ? "" : `${showSelectors.join(",")}{visibility:visible !important;}`;
+      const style = document.createElement("style");
+      style.id = args.styleId;
+      style.textContent = `${massHideRule}
+${showRule}`;
+      document.head.appendChild(style);
+      for (const id of args.hide) {
+        const el = document.getElementById(id);
+        if (el) {
+          el.style.setProperty("visibility", "hidden", "important");
+        }
+        const img = document.getElementById(`__render_frame_${id}__`);
+        if (img) {
+          img.style.setProperty("visibility", "hidden", "important");
+        }
+      }
+    },
+    { show: showIds, hide: extraHideIds, styleId: DOM_LAYER_MASK_STYLE_ID }
+  );
+}
+async function removeDomLayerMask(page, extraHideIds) {
+  await page.evaluate(
+    (args) => {
+      const style = document.getElementById(args.styleId);
+      if (style) style.remove();
+      for (const id of args.hide) {
+        const el = document.getElementById(id);
+        if (el) {
+          el.style.removeProperty("visibility");
+        }
+        const img = document.getElementById(`__render_frame_${id}__`);
+        if (img) img.style.removeProperty("visibility");
+      }
+    },
+    { hide: extraHideIds, styleId: DOM_LAYER_MASK_STYLE_ID }
+  );
+}
 async function injectVideoFramesBatch(page, updates) {
   if (updates.length === 0) return;
   await page.evaluate(
@@ -20857,6 +20916,7 @@ async function injectVideoFramesBatch(page, updates) {
         img.style.objectPosition = computedStyle.objectPosition;
         img.style.zIndex = computedStyle.zIndex;
         for (const property of visualProperties) {
+          if (property === "opacity") continue;
           if (sourceIsStatic && (property === "top" || property === "left" || property === "right" || property === "bottom" || property === "inset")) {
             continue;
           }
@@ -20909,7 +20969,7 @@ async function syncVideoFrameVisibility(page, activeVideoIds) {
     }
   }, activeVideoIds);
 }
-var cdpSessionCache, lastFrameCache, PENDING_FRAME_RETRIES;
+var cdpSessionCache, lastFrameCache, PENDING_FRAME_RETRIES, TRANSPARENT_BG_STYLE_ID, DOM_LAYER_MASK_STYLE_ID;
 var init_screenshotService = __esm({
   "../engine/src/services/screenshotService.ts"() {
     "use strict";
@@ -20917,6 +20977,8 @@ var init_screenshotService = __esm({
     cdpSessionCache = /* @__PURE__ */ new WeakMap();
     lastFrameCache = /* @__PURE__ */ new WeakMap();
     PENDING_FRAME_RETRIES = 5;
+    TRANSPARENT_BG_STYLE_ID = "__hf_transparent_bg__";
+    DOM_LAYER_MASK_STYLE_ID = "__hf_dom_layer_mask__";
   }
 });
 
@@ -22311,10 +22373,10 @@ import { join as join20, extname as extname4 } from "path";
 import { Readable } from "stream";
 import { finished } from "stream/promises";
 function getFilenameFromUrl(url) {
-  const hash = createHash("md5").update(url).digest("hex").slice(0, 12);
+  const hash2 = createHash("md5").update(url).digest("hex").slice(0, 12);
   const urlObj = new URL(url);
   const ext = extname4(urlObj.pathname) || ".mp4";
-  return `download_${hash}${ext}`;
+  return `download_${hash2}${ext}`;
 }
 async function downloadToTemp(url, destDir, timeoutMs = 3e5) {
   const cachedPath = downloadPathCache.get(url);
@@ -22921,14 +22983,103 @@ async function queryElementStacking(page, nativeHdrVideoIds) {
       }
       return 0;
     }
+    function getEffectiveBorderRadius(node) {
+      function resolveRadius(value, el) {
+        if (value.includes("%")) {
+          const pct = parseFloat(value) / 100;
+          const htmlEl = el;
+          const w = htmlEl.offsetWidth || 0;
+          const h3 = htmlEl.offsetHeight || 0;
+          return pct * Math.min(w, h3);
+        }
+        return parseFloat(value) || 0;
+      }
+      const selfCs = window.getComputedStyle(node);
+      const selfRadii = [
+        resolveRadius(selfCs.borderTopLeftRadius, node),
+        resolveRadius(selfCs.borderTopRightRadius, node),
+        resolveRadius(selfCs.borderBottomRightRadius, node),
+        resolveRadius(selfCs.borderBottomLeftRadius, node)
+      ];
+      if (selfRadii[0] > 0 || selfRadii[1] > 0 || selfRadii[2] > 0 || selfRadii[3] > 0) {
+        return selfRadii;
+      }
+      let current = node.parentElement;
+      while (current) {
+        const cs = window.getComputedStyle(current);
+        if (cs.overflow !== "visible") {
+          const tl = resolveRadius(cs.borderTopLeftRadius, current);
+          const tr = resolveRadius(cs.borderTopRightRadius, current);
+          const brr = resolveRadius(cs.borderBottomRightRadius, current);
+          const bl = resolveRadius(cs.borderBottomLeftRadius, current);
+          if (tl > 0 || tr > 0 || brr > 0 || bl > 0) {
+            return [tl, tr, brr, bl];
+          }
+        }
+        current = current.parentElement;
+      }
+      return [0, 0, 0, 0];
+    }
+    function getEffectiveOpacity(node) {
+      let opacity = 1;
+      let current = node;
+      while (current) {
+        const cs = window.getComputedStyle(current);
+        const val = parseFloat(cs.opacity);
+        opacity *= Number.isNaN(val) ? 1 : val;
+        current = current.parentElement;
+      }
+      return opacity;
+    }
+    function getViewportMatrix(node) {
+      const chain = [];
+      let current = node;
+      while (current instanceof HTMLElement) {
+        chain.push(current);
+        const next = current.offsetParent ?? current.parentElement;
+        if (next === current) break;
+        current = next;
+      }
+      let mat = new DOMMatrix();
+      for (let i2 = chain.length - 1; i2 >= 0; i2--) {
+        const htmlEl = chain[i2];
+        if (!htmlEl) continue;
+        mat = mat.translate(htmlEl.offsetLeft, htmlEl.offsetTop);
+        const cs = window.getComputedStyle(htmlEl);
+        if (cs.transform && cs.transform !== "none") {
+          const origin = cs.transformOrigin.split(" ");
+          const ox = resolveLength(origin[0] ?? "0", htmlEl.offsetWidth);
+          const oy = resolveLength(origin[1] ?? "0", htmlEl.offsetHeight);
+          try {
+            const t3 = new DOMMatrix(cs.transform);
+            if (Number.isFinite(t3.a) && Number.isFinite(t3.b) && Number.isFinite(t3.c) && Number.isFinite(t3.d) && Number.isFinite(t3.e) && Number.isFinite(t3.f)) {
+              mat = mat.translate(ox, oy).multiply(t3).translate(-ox, -oy);
+            }
+          } catch {
+          }
+        }
+      }
+      return mat.toString();
+    }
+    function resolveLength(value, basis) {
+      if (value.endsWith("%")) {
+        const pct = parseFloat(value) / 100;
+        return Number.isFinite(pct) ? pct * basis : 0;
+      }
+      const n = parseFloat(value);
+      return Number.isFinite(n) ? n : 0;
+    }
     for (const el of elements) {
       const id = el.id;
       if (!id) continue;
       const rect = el.getBoundingClientRect();
       const style = window.getComputedStyle(el);
       const zIndex = getEffectiveZIndex(el);
-      const opacity = parseFloat(style.opacity) || 1;
+      const isHdrEl = hdrSet.has(id);
+      const opacityStartNode = isHdrEl ? el.parentElement : el;
+      const opacity = opacityStartNode ? getEffectiveOpacity(opacityStartNode) : 1;
       const visible = style.visibility !== "hidden" && style.display !== "none" && rect.width > 0 && rect.height > 0;
+      const htmlEl = el instanceof HTMLElement ? el : null;
       results.push({
         id,
         zIndex,
@@ -22936,9 +23087,16 @@ async function queryElementStacking(page, nativeHdrVideoIds) {
         y: Math.round(rect.y),
         width: Math.round(rect.width),
         height: Math.round(rect.height),
+        layoutWidth: htmlEl?.offsetWidth || Math.round(rect.width),
+        layoutHeight: htmlEl?.offsetHeight || Math.round(rect.height),
         opacity,
         visible,
-        isHdr: hdrSet.has(id)
+        isHdr: hdrSet.has(id),
+        // For HDR elements, use the full accumulated viewport matrix so the
+        // affine blit can apply rotation/scale/translate properly. For DOM
+        // elements, the element-level transform is sufficient for reference.
+        transform: isHdrEl ? getViewportMatrix(el) : style.transform || "none",
+        borderRadius: isHdrEl ? getEffectiveBorderRadius(el) : [0, 0, 0, 0]
       });
     }
     return results;
@@ -23862,6 +24020,99 @@ function blitRgb48leRegion(canvas, source, dx, dy, sw, sh, canvasWidth, canvasHe
     }
   }
 }
+function blitRgb48leAffine(canvas, source, matrix, srcW, srcH, canvasW, canvasH, opacity, borderRadius) {
+  const a = matrix[0];
+  const b = matrix[1];
+  const c2 = matrix[2];
+  const d = matrix[3];
+  const tx = matrix[4];
+  const ty = matrix[5];
+  if (a === void 0 || b === void 0 || c2 === void 0 || d === void 0 || tx === void 0 || ty === void 0)
+    return;
+  const det = a * d - b * c2;
+  if (Math.abs(det) < 1e-10) return;
+  const invA = d / det;
+  const invB = -b / det;
+  const invC = -c2 / det;
+  const invD = a / det;
+  const invTx = -(invA * tx + invC * ty);
+  const invTy = -(invB * tx + invD * ty);
+  const op = opacity ?? 1;
+  const hasMask = borderRadius !== void 0;
+  const corners = [
+    [tx, ty],
+    [a * srcW + tx, b * srcW + ty],
+    [c2 * srcH + tx, d * srcH + ty],
+    [a * srcW + c2 * srcH + tx, b * srcW + d * srcH + ty]
+  ];
+  let minX = canvasW, maxX = 0, minY = canvasH, maxY = 0;
+  for (const corner of corners) {
+    const cx = corner[0] ?? 0;
+    const cy = corner[1] ?? 0;
+    if (cx < minX) minX = cx;
+    if (cx > maxX) maxX = cx;
+    if (cy < minY) minY = cy;
+    if (cy > maxY) maxY = cy;
+  }
+  const startX = Math.max(0, Math.floor(minX));
+  const endX = Math.min(canvasW, Math.ceil(maxX));
+  const startY = Math.max(0, Math.floor(minY));
+  const endY = Math.min(canvasH, Math.ceil(maxY));
+  for (let dy = startY; dy < endY; dy++) {
+    for (let dx = startX; dx < endX; dx++) {
+      const sx = invA * dx + invC * dy + invTx;
+      const sy = invB * dx + invD * dy + invTy;
+      if (sx < 0 || sy < 0 || sx >= srcW || sy >= srcH) continue;
+      let effectiveOp = op;
+      if (hasMask) {
+        const ma = roundedRectAlpha(sx, sy, srcW, srcH, borderRadius);
+        if (ma <= 0) continue;
+        effectiveOp *= ma;
+      }
+      const x0 = Math.floor(sx);
+      const y0 = Math.floor(sy);
+      const fx = sx - x0;
+      const fy = sy - y0;
+      const x1 = Math.min(x0 + 1, srcW - 1);
+      const y1 = Math.min(y0 + 1, srcH - 1);
+      const off00 = (y0 * srcW + x0) * 6;
+      const off10 = (y0 * srcW + x1) * 6;
+      const off01 = (y1 * srcW + x0) * 6;
+      const off11 = (y1 * srcW + x1) * 6;
+      const w00 = (1 - fx) * (1 - fy);
+      const w10 = fx * (1 - fy);
+      const w01 = (1 - fx) * fy;
+      const w11 = fx * fy;
+      const sr = source.readUInt16LE(off00) * w00 + source.readUInt16LE(off10) * w10 + source.readUInt16LE(off01) * w01 + source.readUInt16LE(off11) * w11;
+      const sg = source.readUInt16LE(off00 + 2) * w00 + source.readUInt16LE(off10 + 2) * w10 + source.readUInt16LE(off01 + 2) * w01 + source.readUInt16LE(off11 + 2) * w11;
+      const sb = source.readUInt16LE(off00 + 4) * w00 + source.readUInt16LE(off10 + 4) * w10 + source.readUInt16LE(off01 + 4) * w01 + source.readUInt16LE(off11 + 4) * w11;
+      const dstOff = (dy * canvasW + dx) * 6;
+      if (effectiveOp >= 0.999) {
+        canvas.writeUInt16LE(Math.round(sr), dstOff);
+        canvas.writeUInt16LE(Math.round(sg), dstOff + 2);
+        canvas.writeUInt16LE(Math.round(sb), dstOff + 4);
+      } else {
+        const invEff = 1 - effectiveOp;
+        const dr = canvas.readUInt16LE(dstOff);
+        const dg = canvas.readUInt16LE(dstOff + 2);
+        const db = canvas.readUInt16LE(dstOff + 4);
+        canvas.writeUInt16LE(Math.round(sr * effectiveOp + dr * invEff), dstOff);
+        canvas.writeUInt16LE(Math.round(sg * effectiveOp + dg * invEff), dstOff + 2);
+        canvas.writeUInt16LE(Math.round(sb * effectiveOp + db * invEff), dstOff + 4);
+      }
+    }
+  }
+}
+function parseTransformMatrix(css) {
+  if (!css || css === "none") return null;
+  const match = css.match(
+    /^matrix\(\s*([^,]+),\s*([^,]+),\s*([^,]+),\s*([^,]+),\s*([^,]+),\s*([^,)]+)\s*\)$/
+  );
+  if (!match) return null;
+  const values = match.slice(1, 7).map(Number);
+  if (!values.every(Number.isFinite)) return null;
+  return values;
+}
 var SRGB_TO_HLG, SRGB_TO_PQ;
 var init_alphaBlit = __esm({
   "../engine/src/utils/alphaBlit.ts"() {
@@ -23895,14 +24146,687 @@ var init_layerCompositor = __esm({
   }
 });
 
+// ../engine/src/utils/shaderTransitions.ts
+function pqEotf(signal) {
+  const sp = Math.pow(Math.max(0, signal), 1 / PQ_M2);
+  const num = Math.max(sp - PQ_C1, 0);
+  const den = PQ_C2 - PQ_C3 * sp;
+  return den > 0 ? Math.pow(num / den, 1 / PQ_M1) : 0;
+}
+function pqOetf(linear) {
+  const lp = Math.pow(Math.max(0, linear), PQ_M1);
+  return Math.pow((PQ_C1 + PQ_C2 * lp) / (1 + PQ_C3 * lp), PQ_M2);
+}
+function hlgEotf(signal) {
+  const a = 0.17883277;
+  const b = 1 - 4 * a;
+  const c2 = 0.5 - a * Math.log(4 * a);
+  if (signal <= 0.5) {
+    return signal * signal / 3;
+  }
+  return (Math.exp((signal - c2) / a) + b) / 12;
+}
+function hlgOetf(linear) {
+  const a = 0.17883277;
+  const b = 1 - 4 * a;
+  const c2 = 0.5 - a * Math.log(4 * a);
+  if (linear <= 1 / 12) {
+    return Math.sqrt(3 * linear);
+  }
+  return a * Math.log(12 * linear - b) + c2;
+}
+function buildLut(fn) {
+  const lut = new Uint16Array(65536);
+  for (let i2 = 0; i2 < 65536; i2++) {
+    lut[i2] = Math.round(fn(i2 / 65535) * 65535);
+  }
+  return lut;
+}
+function getPqToLinearLut() {
+  if (!pqToLinearLut) pqToLinearLut = buildLut(pqEotf);
+  return pqToLinearLut;
+}
+function getLinearToPqLut() {
+  if (!linearToPqLut) linearToPqLut = buildLut(pqOetf);
+  return linearToPqLut;
+}
+function getHlgToLinearLut() {
+  if (!hlgToLinearLut) hlgToLinearLut = buildLut(hlgEotf);
+  return hlgToLinearLut;
+}
+function getLinearToHlgLut() {
+  if (!linearToHlgLut) linearToHlgLut = buildLut(hlgOetf);
+  return linearToHlgLut;
+}
+function hdrToLinear(buf, transfer) {
+  const lut = transfer === "pq" ? getPqToLinearLut() : getHlgToLinearLut();
+  const len = buf.length / 2;
+  for (let i2 = 0; i2 < len; i2++) {
+    const off = i2 * 2;
+    buf.writeUInt16LE(lut[buf.readUInt16LE(off)] ?? 0, off);
+  }
+}
+function linearToHdr(buf, transfer) {
+  const lut = transfer === "pq" ? getLinearToPqLut() : getLinearToHlgLut();
+  const len = buf.length / 2;
+  for (let i2 = 0; i2 < len; i2++) {
+    const off = i2 * 2;
+    buf.writeUInt16LE(lut[buf.readUInt16LE(off)] ?? 0, off);
+  }
+}
+function hlgSceneToPqDisplay(sceneLinear) {
+  const displayNits = HLG_OOTF_LW * Math.pow(Math.max(0, sceneLinear), HLG_OOTF_GAMMA);
+  return displayNits / 1e4;
+}
+function pqDisplayToHlgScene(displayNormalized) {
+  const displayNits = displayNormalized * 1e4;
+  return Math.pow(Math.max(0, displayNits / HLG_OOTF_LW), 1 / HLG_OOTF_GAMMA);
+}
+function getHlgToPqLut() {
+  if (!hlgToPqLut) hlgToPqLut = buildLut((v) => pqOetf(hlgSceneToPqDisplay(hlgEotf(v))));
+  return hlgToPqLut;
+}
+function getPqToHlgLut() {
+  if (!pqToHlgLut) pqToHlgLut = buildLut((v) => hlgOetf(pqDisplayToHlgScene(pqEotf(v))));
+  return pqToHlgLut;
+}
+function convertTransfer(buf, from, to) {
+  if (from === to) return;
+  const lut = from === "hlg" ? getHlgToPqLut() : getPqToHlgLut();
+  const len = buf.length / 2;
+  for (let i2 = 0; i2 < len; i2++) {
+    const off = i2 * 2;
+    buf.writeUInt16LE(lut[buf.readUInt16LE(off)] ?? 0, off);
+  }
+}
+function sampleRgb48le(buf, u, v, w, h3) {
+  const uc = Math.max(0, Math.min(1, u));
+  const vc = Math.max(0, Math.min(1, v));
+  const sx = uc * (w - 1);
+  const sy = vc * (h3 - 1);
+  const x0 = Math.floor(sx);
+  const y0 = Math.floor(sy);
+  const x1 = Math.min(x0 + 1, w - 1);
+  const y1 = Math.min(y0 + 1, h3 - 1);
+  const fx = sx - x0;
+  const fy = sy - y0;
+  const w00 = (1 - fx) * (1 - fy);
+  const w10 = fx * (1 - fy);
+  const w01 = (1 - fx) * fy;
+  const w11 = fx * fy;
+  const off00 = (y0 * w + x0) * 6;
+  const off10 = (y0 * w + x1) * 6;
+  const off01 = (y1 * w + x0) * 6;
+  const off11 = (y1 * w + x1) * 6;
+  const r2 = Math.round(
+    buf.readUInt16LE(off00) * w00 + buf.readUInt16LE(off10) * w10 + buf.readUInt16LE(off01) * w01 + buf.readUInt16LE(off11) * w11
+  );
+  const g = Math.round(
+    buf.readUInt16LE(off00 + 2) * w00 + buf.readUInt16LE(off10 + 2) * w10 + buf.readUInt16LE(off01 + 2) * w01 + buf.readUInt16LE(off11 + 2) * w11
+  );
+  const b = Math.round(
+    buf.readUInt16LE(off00 + 4) * w00 + buf.readUInt16LE(off10 + 4) * w10 + buf.readUInt16LE(off01 + 4) * w01 + buf.readUInt16LE(off11 + 4) * w11
+  );
+  return [r2, g, b];
+}
+function mix16(a, b, t3) {
+  return Math.round(a * (1 - t3) + b * t3);
+}
+function clamp16(v) {
+  return Math.max(0, Math.min(65535, v));
+}
+function smoothstep(edge0, edge1, x4) {
+  const t3 = Math.max(0, Math.min(1, (x4 - edge0) / (edge1 - edge0)));
+  return t3 * t3 * (3 - 2 * t3);
+}
+function hash(x4, y2) {
+  return (Math.sin(x4 * 127.1 + y2 * 311.7) * 43758.5453 % 1 + 1) % 1;
+}
+function vnoise(px, py) {
+  const ix = Math.floor(px);
+  const iy = Math.floor(py);
+  let fx = px - ix;
+  let fy = py - iy;
+  fx = fx * fx * fx * (fx * (fx * 6 - 15) + 10);
+  fy = fy * fy * fy * (fy * (fy * 6 - 15) + 10);
+  const h00 = hash(ix, iy);
+  const h10 = hash(ix + 1, iy);
+  const h01 = hash(ix, iy + 1);
+  const h11 = hash(ix + 1, iy + 1);
+  return h00 * (1 - fx) * (1 - fy) + h10 * fx * (1 - fy) + h01 * (1 - fx) * fy + h11 * fx * fy;
+}
+function fbm(px, py) {
+  let value = 0;
+  let amplitude = 0.5;
+  let x4 = px;
+  let y2 = py;
+  for (let i2 = 0; i2 < 5; i2++) {
+    value += amplitude * vnoise(x4, y2);
+    const nx = ROT_A * x4 - ROT_B * y2;
+    const ny = ROT_B * x4 + ROT_A * y2;
+    x4 = nx * 2.02;
+    y2 = ny * 2.02;
+    amplitude *= 0.5;
+  }
+  return value;
+}
+function glitchRand(x4, y2) {
+  return (Math.sin(x4 * 12.9898 + y2 * 78.233) * 43758.5453 % 1 + 1) % 1;
+}
+function aces(x4) {
+  return Math.max(0, Math.min(1, x4 * (2.51 * x4 + 0.03) / (x4 * (2.43 * x4 + 0.59) + 0.14)));
+}
+function ridged(px, py) {
+  let value = 0;
+  let amplitude = 0.5;
+  let x4 = px;
+  let y2 = py;
+  for (let i2 = 0; i2 < 5; i2++) {
+    value += amplitude * Math.abs(vnoise(x4, y2) * 2 - 1);
+    const nx = ROT_A * x4 - ROT_B * y2;
+    const ny = ROT_B * x4 + ROT_A * y2;
+    x4 = nx * 2.02;
+    y2 = ny * 2.02;
+    amplitude *= 0.5;
+  }
+  return value;
+}
+var PQ_M1, PQ_M2, PQ_C1, PQ_C2, PQ_C3, pqToLinearLut, linearToPqLut, hlgToLinearLut, linearToHlgLut, HLG_OOTF_LW, HLG_OOTF_GAMMA, hlgToPqLut, pqToHlgLut, ROT_A, ROT_B, TRANSITIONS, crossfade, flashThroughWhite, chromaticSplit, sdfIris, glitch, lightLeak, crossWarpMorph, whipPan, cinematicZoom, gravitationalLens, rippleWaves, swirlVortex, thermalDistortion, domainWarp, ridgedBurn;
+var init_shaderTransitions = __esm({
+  "../engine/src/utils/shaderTransitions.ts"() {
+    "use strict";
+    PQ_M1 = 0.1593017578125;
+    PQ_M2 = 78.84375;
+    PQ_C1 = 0.8359375;
+    PQ_C2 = 18.8515625;
+    PQ_C3 = 18.6875;
+    pqToLinearLut = null;
+    linearToPqLut = null;
+    hlgToLinearLut = null;
+    linearToHlgLut = null;
+    HLG_OOTF_LW = 1e3;
+    HLG_OOTF_GAMMA = 1.2 * Math.pow(1.111, Math.log2(HLG_OOTF_LW / 1e3));
+    hlgToPqLut = null;
+    pqToHlgLut = null;
+    ROT_A = 0.8;
+    ROT_B = 0.6;
+    TRANSITIONS = {};
+    crossfade = (from, to, out, w, h3, p) => {
+      const inv = 1 - p;
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const o = i2 * 6;
+        out.writeUInt16LE(Math.round(from.readUInt16LE(o) * inv + to.readUInt16LE(o) * p), o);
+        out.writeUInt16LE(
+          Math.round(from.readUInt16LE(o + 2) * inv + to.readUInt16LE(o + 2) * p),
+          o + 2
+        );
+        out.writeUInt16LE(
+          Math.round(from.readUInt16LE(o + 4) * inv + to.readUInt16LE(o + 4) * p),
+          o + 4
+        );
+      }
+    };
+    TRANSITIONS["crossfade"] = crossfade;
+    flashThroughWhite = (from, to, out, w, h3, p) => {
+      const toWhite = smoothstep(0, 0.45, p);
+      const fromWhite = 1 - smoothstep(0.5, 1, p);
+      const blend = smoothstep(0.35, 0.65, p);
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const o = i2 * 6;
+        const fromR = mix16(from.readUInt16LE(o), 65535, toWhite);
+        const fromG = mix16(from.readUInt16LE(o + 2), 65535, toWhite);
+        const fromB = mix16(from.readUInt16LE(o + 4), 65535, toWhite);
+        const toR = mix16(to.readUInt16LE(o), 65535, fromWhite);
+        const toG = mix16(to.readUInt16LE(o + 2), 65535, fromWhite);
+        const toB = mix16(to.readUInt16LE(o + 4), 65535, fromWhite);
+        out.writeUInt16LE(mix16(fromR, toR, blend), o);
+        out.writeUInt16LE(mix16(fromG, toG, blend), o + 2);
+        out.writeUInt16LE(mix16(fromB, toB, blend), o + 4);
+      }
+    };
+    TRANSITIONS["flash-through-white"] = flashThroughWhite;
+    chromaticSplit = (from, to, out, w, h3, p) => {
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const cx = ux - 0.5;
+        const cy = uy - 0.5;
+        const fromShift = p * 0.06;
+        const fr = sampleRgb48le(from, ux + cx * fromShift, uy + cy * fromShift, w, h3)[0];
+        const fg = sampleRgb48le(from, ux, uy, w, h3)[1];
+        const fb = sampleRgb48le(from, ux - cx * fromShift, uy - cy * fromShift, w, h3)[2];
+        const toShift = (1 - p) * 0.06;
+        const tr = sampleRgb48le(to, ux - cx * toShift, uy - cy * toShift, w, h3)[0];
+        const tg = sampleRgb48le(to, ux, uy, w, h3)[1];
+        const tb = sampleRgb48le(to, ux + cx * toShift, uy + cy * toShift, w, h3)[2];
+        out.writeUInt16LE(clamp16(mix16(fr, tr, p)), o);
+        out.writeUInt16LE(clamp16(mix16(fg, tg, p)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(fb, tb, p)), o + 4);
+      }
+    };
+    TRANSITIONS["chromatic-split"] = chromaticSplit;
+    sdfIris = (from, to, out, w, h3, p) => {
+      const accentBright = [65535, 55e3, 35e3];
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const ax = (ux - 0.5) * (w / h3);
+        const ay = uy - 0.5;
+        const d = Math.sqrt(ax * ax + ay * ay);
+        const radius = p * 1.2;
+        const fw = 3e-3;
+        const edge = smoothstep(radius + fw, radius - fw, d);
+        const ring1 = Math.exp(-Math.abs(d - radius) * 25);
+        const ring2 = Math.exp(-Math.abs(d - radius + 0.04) * 20) * 0.5;
+        const ring3 = Math.exp(-Math.abs(d - radius + 0.08) * 15) * 0.25;
+        const glow = (ring1 + ring2 + ring3) * p * (1 - p) * 4;
+        const [fromR, fromG, fromB] = sampleRgb48le(from, ux, uy, w, h3);
+        const [toR, toG, toB] = sampleRgb48le(to, ux, uy, w, h3);
+        out.writeUInt16LE(clamp16(mix16(fromR, toR, edge) + accentBright[0] * glow * 0.6), o);
+        out.writeUInt16LE(clamp16(mix16(fromG, toG, edge) + accentBright[1] * glow * 0.6), o + 2);
+        out.writeUInt16LE(clamp16(mix16(fromB, toB, edge) + accentBright[2] * glow * 0.6), o + 4);
+      }
+    };
+    TRANSITIONS["sdf-iris"] = sdfIris;
+    glitch = (from, to, out, w, h3, p) => {
+      const intensity = p * (1 - p) * 4;
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const lineY = Math.floor(uy * 60) / 60;
+        const lineDisp = (glitchRand(lineY, Math.floor(p * 17)) - 0.5) * 0.18 * intensity;
+        const blockX = Math.floor(ux * 12);
+        const blockY = Math.floor(uy * 8);
+        const progressStep = Math.floor(p * 11);
+        const br = glitchRand(blockX + progressStep, blockY + progressStep);
+        const ba = (br >= 0.83 ? 1 : 0) * intensity;
+        const bdx = (glitchRand(blockX * 2.1, blockY * 2.1) - 0.5) * 0.35 * ba;
+        const bdy = (glitchRand(blockX * 3.7, blockY * 3.7) - 0.5) * 0.35 * ba;
+        const uvx = Math.max(0, Math.min(1, ux + lineDisp + bdx));
+        const uvy = Math.max(0, Math.min(1, uy + bdy));
+        const shift = intensity * 0.035;
+        const r2 = sampleRgb48le(from, uvx + shift, uvy, w, h3)[0];
+        const g = sampleRgb48le(from, uvx, uvy, w, h3)[1];
+        const b = sampleRgb48le(from, uvx - shift, uvy, w, h3)[2];
+        let cr = r2 / 65535;
+        let cg = g / 65535;
+        let cb = b / 65535;
+        const scanline = (uy * h3 * 0.5 % 1 + 1) % 1 >= 0.5 ? 0.05 * intensity : 0;
+        cr -= scanline;
+        cg -= scanline;
+        cb -= scanline;
+        const flicker = 1 + (glitchRand(Math.floor(p * 23), 0) - 0.5) * 0.3 * intensity;
+        cr *= flicker;
+        cg *= flicker;
+        cb *= flicker;
+        const levels = 256 - (256 - 8) * (intensity * 0.5);
+        cr = Math.floor(cr * levels) / levels;
+        cg = Math.floor(cg * levels) / levels;
+        cb = Math.floor(cb * levels) / levels;
+        const [toR, toG, toB] = sampleRgb48le(to, ux, uy, w, h3);
+        out.writeUInt16LE(clamp16(mix16(Math.round(cr * 65535), toR, p)), o);
+        out.writeUInt16LE(clamp16(mix16(Math.round(cg * 65535), toG, p)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(Math.round(cb * 65535), toB, p)), o + 4);
+      }
+    };
+    TRANSITIONS["glitch"] = glitch;
+    lightLeak = (from, to, out, w, h3, p) => {
+      const accent = [5e4 / 65535, 25e3 / 65535, 5e3 / 65535];
+      const accentBright = [65535 / 65535, 55e3 / 65535, 35e3 / 65535];
+      const lpx = 1.3;
+      const lpy = -0.2;
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const dx = ux - lpx;
+        const dy = uy - lpy;
+        const dist = Math.sqrt(dx * dx + dy * dy);
+        const leak = Math.max(0, Math.min(1, Math.exp(-dist * 1.8) * p * 4));
+        const warmR = accent[0] + (accentBright[0] - accent[0]) * dist * 0.7;
+        const warmG = accent[1] + (accentBright[1] - accent[1]) * dist * 0.7;
+        const warmB = accent[2] + (accentBright[2] - accent[2]) * dist * 0.7;
+        const flare = Math.exp(-Math.abs(uy - (-0.2 + ux * 0.3)) * 15) * leak * 0.3;
+        const [fr, fg, fb] = sampleRgb48le(from, ux, uy, w, h3);
+        const fromR = fr / 65535;
+        const fromG = fg / 65535;
+        const fromB = fb / 65535;
+        const overR = aces(fromR + warmR * leak * 3 + accentBright[0] * flare);
+        const overG = aces(fromG + warmG * leak * 3 + accentBright[1] * flare);
+        const overB = aces(fromB + warmB * leak * 3 + accentBright[2] * flare);
+        const [toR, toG, toB] = sampleRgb48le(to, ux, uy, w, h3);
+        const blend = smoothstep(0.15, 0.85, p);
+        out.writeUInt16LE(clamp16(mix16(Math.round(overR * 65535), toR, blend)), o);
+        out.writeUInt16LE(clamp16(mix16(Math.round(overG * 65535), toG, blend)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(Math.round(overB * 65535), toB, blend)), o + 4);
+      }
+    };
+    TRANSITIONS["light-leak"] = lightLeak;
+    crossWarpMorph = (from, to, out, w, h3, p) => {
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const dispX = fbm(ux * 3, uy * 3) - 0.5;
+        const dispY = fbm(ux * 3 + 7.3, uy * 3 + 3.7) - 0.5;
+        const fromUx = Math.max(0, Math.min(1, ux + dispX * p * 0.5));
+        const fromUy = Math.max(0, Math.min(1, uy + dispY * p * 0.5));
+        const toUx = Math.max(0, Math.min(1, ux - dispX * (1 - p) * 0.5));
+        const toUy = Math.max(0, Math.min(1, uy - dispY * (1 - p) * 0.5));
+        const [fromR, fromG, fromB] = sampleRgb48le(from, fromUx, fromUy, w, h3);
+        const [toR, toG, toB] = sampleRgb48le(to, toUx, toUy, w, h3);
+        const n = fbm(ux * 4 + 3.1, uy * 4 + 1.7);
+        const blend = smoothstep(0.4, 0.6, n + p * 1.2 - 0.6);
+        out.writeUInt16LE(clamp16(mix16(fromR, toR, blend)), o);
+        out.writeUInt16LE(clamp16(mix16(fromG, toG, blend)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(fromB, toB, blend)), o + 4);
+      }
+    };
+    TRANSITIONS["cross-warp-morph"] = crossWarpMorph;
+    whipPan = (from, to, out, w, h3, p) => {
+      const fromOff = p * 1.5;
+      const toOff = (1 - p) * 1.5;
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        let fromR = 0, fromG = 0, fromB = 0;
+        for (let s2 = 0; s2 < 10; s2++) {
+          const f3 = s2 / 10;
+          const fuv = Math.max(0, Math.min(1, ux + fromOff + p * 0.08 * f3));
+          const [r2, g, b] = sampleRgb48le(from, fuv, uy, w, h3);
+          fromR += r2;
+          fromG += g;
+          fromB += b;
+        }
+        fromR /= 10;
+        fromG /= 10;
+        fromB /= 10;
+        let toR = 0, toG = 0, toB = 0;
+        for (let s2 = 0; s2 < 10; s2++) {
+          const f3 = s2 / 10;
+          const tuv = Math.max(0, Math.min(1, ux - toOff - (1 - p) * 0.08 * f3));
+          const [r2, g, b] = sampleRgb48le(to, tuv, uy, w, h3);
+          toR += r2;
+          toG += g;
+          toB += b;
+        }
+        toR /= 10;
+        toG /= 10;
+        toB /= 10;
+        out.writeUInt16LE(clamp16(mix16(Math.round(fromR), Math.round(toR), p)), o);
+        out.writeUInt16LE(clamp16(mix16(Math.round(fromG), Math.round(toG), p)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(Math.round(fromB), Math.round(toB), p)), o + 4);
+      }
+    };
+    TRANSITIONS["whip-pan"] = whipPan;
+    cinematicZoom = (from, to, out, w, h3, p) => {
+      const fromS = p * 0.08;
+      const toS = (1 - p) * 0.06;
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const dx = ux - 0.5;
+        const dy = uy - 0.5;
+        let fr = 0, fg = 0, fb = 0;
+        for (let s2 = 0; s2 < 12; s2++) {
+          const f3 = s2 / 12;
+          const rr = sampleRgb48le(
+            from,
+            ux - dx * fromS * 1.06 * f3,
+            uy - dy * fromS * 1.06 * f3,
+            w,
+            h3
+          )[0];
+          const gg = sampleRgb48le(from, ux - dx * fromS * f3, uy - dy * fromS * f3, w, h3)[1];
+          const bb = sampleRgb48le(
+            from,
+            ux - dx * fromS * 0.94 * f3,
+            uy - dy * fromS * 0.94 * f3,
+            w,
+            h3
+          )[2];
+          fr += rr;
+          fg += gg;
+          fb += bb;
+        }
+        fr /= 12;
+        fg /= 12;
+        fb /= 12;
+        let tr = 0, tg = 0, tb = 0;
+        for (let s2 = 0; s2 < 12; s2++) {
+          const f3 = s2 / 12;
+          const rr = sampleRgb48le(to, ux + dx * toS * 1.06 * f3, uy + dy * toS * 1.06 * f3, w, h3)[0];
+          const gg = sampleRgb48le(to, ux + dx * toS * f3, uy + dy * toS * f3, w, h3)[1];
+          const bb = sampleRgb48le(to, ux + dx * toS * 0.94 * f3, uy + dy * toS * 0.94 * f3, w, h3)[2];
+          tr += rr;
+          tg += gg;
+          tb += bb;
+        }
+        tr /= 12;
+        tg /= 12;
+        tb /= 12;
+        out.writeUInt16LE(clamp16(mix16(Math.round(fr), Math.round(tr), p)), o);
+        out.writeUInt16LE(clamp16(mix16(Math.round(fg), Math.round(tg), p)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(Math.round(fb), Math.round(tb), p)), o + 4);
+      }
+    };
+    TRANSITIONS["cinematic-zoom"] = cinematicZoom;
+    gravitationalLens = (from, to, out, w, h3, p) => {
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const uvx = ux - 0.5;
+        const uvy = uy - 0.5;
+        const dist = Math.sqrt(uvx * uvx + uvy * uvy);
+        const pull = p * 2;
+        const warpStr = pull * 0.3 / (dist + 0.1);
+        const warpedX = Math.max(0, Math.min(1, ux - uvx * warpStr));
+        const warpedY = Math.max(0, Math.min(1, uy - uvy * warpStr));
+        const [, ag] = sampleRgb48le(from, warpedX, warpedY, w, h3);
+        const horizon = smoothstep(0, 0.3, dist / (1 - p * 0.85 + 1e-3));
+        const shift = pull * 0.02 / (dist + 0.2);
+        const rSampX = Math.max(0, Math.min(1, ux - uvx * (warpStr + shift)));
+        const rSampY = Math.max(0, Math.min(1, uy - uvy * (warpStr + shift)));
+        const bSampX = Math.max(0, Math.min(1, ux - uvx * (warpStr - shift)));
+        const bSampY = Math.max(0, Math.min(1, uy - uvy * (warpStr - shift)));
+        const ar = sampleRgb48le(from, rSampX, rSampY, w, h3)[0];
+        const ab = sampleRgb48le(from, bSampX, bSampY, w, h3)[2];
+        const lensedR = Math.round(ar * horizon);
+        const lensedG = Math.round(ag * horizon);
+        const lensedB = Math.round(ab * horizon);
+        const [toR, toG, toB] = sampleRgb48le(to, ux, uy, w, h3);
+        const blend = smoothstep(0.3, 0.9, p);
+        out.writeUInt16LE(clamp16(mix16(lensedR, toR, blend)), o);
+        out.writeUInt16LE(clamp16(mix16(lensedG, toG, blend)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(lensedB, toB, blend)), o + 4);
+      }
+    };
+    TRANSITIONS["gravitational-lens"] = gravitationalLens;
+    rippleWaves = (from, to, out, w, h3, p) => {
+      const accentBright = [65535, 55e3, 35e3];
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const uvx = ux - 0.5;
+        const uvy = uy - 0.5;
+        const dist = Math.sqrt(uvx * uvx + uvy * uvy);
+        const nux = uvx + 1e-3;
+        const nuy = uvy + 1e-3;
+        const nlen = Math.sqrt(nux * nux + nuy * nuy);
+        const dirx = nux / nlen;
+        const diry = nuy / nlen;
+        const fromAmp = p * 0.04;
+        const fw1 = Math.exp(Math.sin(dist * 25 - p * 12) - 1);
+        const fw2 = Math.exp(Math.sin(dist * 50 - p * 18) - 1) * 0.5;
+        const fromUx = Math.max(0, Math.min(1, ux + dirx * (fw1 + fw2) * fromAmp));
+        const fromUy = Math.max(0, Math.min(1, uy + diry * (fw1 + fw2) * fromAmp));
+        const toAmp = (1 - p) * 0.04;
+        const tw1 = Math.exp(Math.sin(dist * 25 + p * 12) - 1);
+        const tw2 = Math.exp(Math.sin(dist * 50 + p * 18) - 1) * 0.5;
+        const toUx = Math.max(0, Math.min(1, ux - dirx * (tw1 + tw2) * toAmp));
+        const toUy = Math.max(0, Math.min(1, uy - diry * (tw1 + tw2) * toAmp));
+        const [fromR, fromG, fromB] = sampleRgb48le(from, fromUx, fromUy, w, h3);
+        const [toR, toG, toB] = sampleRgb48le(to, toUx, toUy, w, h3);
+        const peak = fw1 * p;
+        const tintR = accentBright[0] * peak * 0.1;
+        const tintG = accentBright[1] * peak * 0.1;
+        const tintB = accentBright[2] * peak * 0.1;
+        out.writeUInt16LE(clamp16(mix16(Math.round(fromR + tintR), toR, p)), o);
+        out.writeUInt16LE(clamp16(mix16(Math.round(fromG + tintG), toG, p)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(Math.round(fromB + tintB), toB, p)), o + 4);
+      }
+    };
+    TRANSITIONS["ripple-waves"] = rippleWaves;
+    swirlVortex = (from, to, out, w, h3, p) => {
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const uvx = ux - 0.5;
+        const uvy = uy - 0.5;
+        const dist = Math.sqrt(uvx * uvx + uvy * uvy);
+        const warp = fbm(ux * 4, uy * 4) * 0.5;
+        const fromAng = p * (1 - dist) * 10 + warp * p * 3;
+        const fs4 = Math.sin(fromAng);
+        const fc = Math.cos(fromAng);
+        const fromUx = Math.max(0, Math.min(1, uvx * fc - uvy * fs4 + 0.5));
+        const fromUy = Math.max(0, Math.min(1, uvx * fs4 + uvy * fc + 0.5));
+        const toAng = -(1 - p) * (1 - dist) * 10 - warp * (1 - p) * 3;
+        const ts = Math.sin(toAng);
+        const tc = Math.cos(toAng);
+        const toUx = Math.max(0, Math.min(1, uvx * tc - uvy * ts + 0.5));
+        const toUy = Math.max(0, Math.min(1, uvx * ts + uvy * tc + 0.5));
+        const [fromR, fromG, fromB] = sampleRgb48le(from, fromUx, fromUy, w, h3);
+        const [toR, toG, toB] = sampleRgb48le(to, toUx, toUy, w, h3);
+        out.writeUInt16LE(clamp16(mix16(fromR, toR, p)), o);
+        out.writeUInt16LE(clamp16(mix16(fromG, toG, p)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(fromB, toB, p)), o + 4);
+      }
+    };
+    TRANSITIONS["swirl-vortex"] = swirlVortex;
+    thermalDistortion = (from, to, out, w, h3, p) => {
+      const accentBright = [65535, 55e3, 35e3];
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const heat = p * 1.5;
+        const yFade = smoothstep(1, 0, uy);
+        const shimmer = Math.sin(uy * 40 + fbm(ux * 6, uy * 6) * 8) * fbm(ux * 3 + 0, uy * 3 + p * 2);
+        const dispX = shimmer * heat * 0.03 * yFade;
+        const fromUx = Math.max(0, Math.min(1, ux + dispX));
+        const [fromR, fromG, fromB] = sampleRgb48le(from, fromUx, uy, w, h3);
+        const invShimmer = Math.sin(uy * 40 + fbm(ux * 6 + 3, uy * 6 + 3) * 8) * fbm(ux * 3 + 3, uy * 3 + p * 2);
+        const dispX2 = invShimmer * (1 - p) * 0.03 * yFade;
+        const toUx = Math.max(0, Math.min(1, ux + dispX2));
+        const [toR, toG, toB] = sampleRgb48le(to, toUx, uy, w, h3);
+        const haze = heat * yFade * 0.15 * (1 - p);
+        out.writeUInt16LE(clamp16(mix16(fromR, toR, p) + Math.round(accentBright[0] * haze)), o);
+        out.writeUInt16LE(clamp16(mix16(fromG, toG, p) + Math.round(accentBright[1] * haze)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(fromB, toB, p) + Math.round(accentBright[2] * haze)), o + 4);
+      }
+    };
+    TRANSITIONS["thermal-distortion"] = thermalDistortion;
+    domainWarp = (from, to, out, w, h3, p) => {
+      const accentDark = [25e3, 8e3, 2e3];
+      const accentBright = [65535, 55e3, 35e3];
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const qx = fbm(ux * 3, uy * 3);
+        const qy = fbm(ux * 3 + 5.2, uy * 3 + 1.3);
+        const rx = fbm(ux * 3 + qx * 4 + 1.7, uy * 3 + qy * 4 + 9.2);
+        const ry = fbm(ux * 3 + qx * 4 + 8.3, uy * 3 + qy * 4 + 2.8);
+        const n = fbm(ux * 3 + rx * 2, uy * 3 + ry * 2);
+        const warpDirX = (qx - 0.5) * 0.4;
+        const warpDirY = (qy - 0.5) * 0.4;
+        const aUx = Math.max(0, Math.min(1, ux + warpDirX * p));
+        const aUy = Math.max(0, Math.min(1, uy + warpDirY * p));
+        const bUx = Math.max(0, Math.min(1, ux - warpDirX * (1 - p)));
+        const bUy = Math.max(0, Math.min(1, uy - warpDirY * (1 - p)));
+        const [aR, aG, aB] = sampleRgb48le(from, aUx, aUy, w, h3);
+        const [bR, bG, bB] = sampleRgb48le(to, bUx, bUy, w, h3);
+        const e2 = smoothstep(p - 0.08, p + 0.08, n);
+        const ed = Math.abs(n - p);
+        const pStep = p >= 1 ? 1 : 0;
+        const em = smoothstep(0.1, 0, ed) * (1 - pStep);
+        const ecBlend = smoothstep(0, 0.1, ed);
+        const ecR = accentDark[0] + (accentBright[0] - accentDark[0]) * (1 - ecBlend);
+        const ecG = accentDark[1] + (accentBright[1] - accentDark[1]) * (1 - ecBlend);
+        const ecB = accentDark[2] + (accentBright[2] - accentDark[2]) * (1 - ecBlend);
+        out.writeUInt16LE(clamp16(mix16(bR, aR, e2) + Math.round(ecR * em * 2)), o);
+        out.writeUInt16LE(clamp16(mix16(bG, aG, e2) + Math.round(ecG * em * 2)), o + 2);
+        out.writeUInt16LE(clamp16(mix16(bB, aB, e2) + Math.round(ecB * em * 2)), o + 4);
+      }
+    };
+    TRANSITIONS["domain-warp"] = domainWarp;
+    ridgedBurn = (from, to, out, w, h3, p) => {
+      const accent = [5e4, 25e3, 5e3];
+      const accentDark = [25e3, 8e3, 2e3];
+      const accentBright = [65535, 55e3, 35e3];
+      for (let i2 = 0; i2 < w * h3; i2++) {
+        const ux = i2 % w / w;
+        const uy = Math.floor(i2 / w) / h3;
+        const o = i2 * 6;
+        const [aR, aG, aB] = sampleRgb48le(from, ux, uy, w, h3);
+        const [bR, bG, bB] = sampleRgb48le(to, ux, uy, w, h3);
+        const n = ridged(ux * 4, uy * 4);
+        const e2 = smoothstep(p - 0.04, p + 0.04, n);
+        const heat = smoothstep(0.12, 0, Math.abs(n - p));
+        const pStep = p >= 1 ? 1 : 0;
+        const heatMasked = heat * (1 - pStep);
+        let burnR = accentDark[0] + (accent[0] - accentDark[0]) * smoothstep(0, 0.25, heatMasked);
+        let burnG = accentDark[1] + (accent[1] - accentDark[1]) * smoothstep(0, 0.25, heatMasked);
+        let burnB = accentDark[2] + (accent[2] - accentDark[2]) * smoothstep(0, 0.25, heatMasked);
+        const blend2 = smoothstep(0.25, 0.5, heatMasked);
+        burnR = burnR + (accentBright[0] - burnR) * blend2;
+        burnG = burnG + (accentBright[1] - burnG) * blend2;
+        burnB = burnB + (accentBright[2] - burnB) * blend2;
+        const blend3 = smoothstep(0.5, 1, heatMasked);
+        burnR = burnR + (65535 - burnR) * blend3;
+        burnG = burnG + (65535 - burnG) * blend3;
+        burnB = burnB + (65535 - burnB) * blend3;
+        const sparks = (vnoise(ux * 80, uy * 80) >= 0.92 ? 1 : 0) * heatMasked * 3;
+        out.writeUInt16LE(
+          clamp16(
+            mix16(bR, aR, e2) + Math.round(burnR * heatMasked * 3.5) + Math.round(accentBright[0] * sparks)
+          ),
+          o
+        );
+        out.writeUInt16LE(
+          clamp16(
+            mix16(bG, aG, e2) + Math.round(burnG * heatMasked * 3.5) + Math.round(accentBright[1] * sparks)
+          ),
+          o + 2
+        );
+        out.writeUInt16LE(
+          clamp16(
+            mix16(bB, aB, e2) + Math.round(burnB * heatMasked * 3.5) + Math.round(accentBright[2] * sparks)
+          ),
+          o + 4
+        );
+      }
+    };
+    TRANSITIONS["ridged-burn"] = ridgedBurn;
+  }
+});
+
 // ../engine/src/services/hdrCapture.ts
 import { existsSync as existsSync22, readdirSync as readdirSync10 } from "fs";
 import { join as join25 } from "path";
 import { homedir as homedir6 } from "os";
 function linearToPQ(L2) {
   const Lp = Math.max(0, L2 * SDR_NITS / PQ_MAX_NITS);
-  const Lm1 = Math.pow(Lp, PQ_M1);
-  return Math.pow((PQ_C1 + PQ_C2 * Lm1) / (1 + PQ_C3 * Lm1), PQ_M2);
+  const Lm1 = Math.pow(Lp, PQ_M12);
+  return Math.pow((PQ_C12 + PQ_C22 * Lm1) / (1 + PQ_C32 * Lm1), PQ_M22);
 }
 function float16Decode(h3) {
   const sign = h3 >> 15 & 1;
@@ -24093,15 +25017,15 @@ function buildHdrChromeArgs(width, height) {
     "--force-gpu-mem-available-mb=4096"
   ];
 }
-var PQ_M1, PQ_M2, PQ_C1, PQ_C2, PQ_C3, PQ_MAX_NITS, SDR_NITS;
+var PQ_M12, PQ_M22, PQ_C12, PQ_C22, PQ_C32, PQ_MAX_NITS, SDR_NITS;
 var init_hdrCapture = __esm({
   "../engine/src/services/hdrCapture.ts"() {
     "use strict";
-    PQ_M1 = 0.1593017578125;
-    PQ_M2 = 78.84375;
-    PQ_C1 = 0.8359375;
-    PQ_C2 = 18.8515625;
-    PQ_C3 = 18.6875;
+    PQ_M12 = 0.1593017578125;
+    PQ_M22 = 78.84375;
+    PQ_C12 = 0.8359375;
+    PQ_C22 = 18.8515625;
+    PQ_C32 = 18.6875;
     PQ_MAX_NITS = 1e4;
     SDR_NITS = 203;
   }
@@ -24111,15 +25035,19 @@ var init_hdrCapture = __esm({
 var src_exports = {};
 __export(src_exports, {
   DEFAULT_CONFIG: () => DEFAULT_CONFIG2,
+  DOM_LAYER_MASK_STYLE_ID: () => DOM_LAYER_MASK_STYLE_ID,
   ENABLE_BROWSER_POOL: () => ENABLE_BROWSER_POOL,
   ENCODER_PRESETS: () => ENCODER_PRESETS,
   FrameLookupTable: () => FrameLookupTable,
   MEDIA_VISUAL_STYLE_PROPERTIES: () => MEDIA_VISUAL_STYLE_PROPERTIES,
+  TRANSITIONS: () => TRANSITIONS,
   acquireBrowser: () => acquireBrowser,
   analyzeCompositionHdr: () => analyzeCompositionHdr,
   analyzeKeyframeIntervals: () => analyzeKeyframeIntervals,
+  applyDomLayerMask: () => applyDomLayerMask,
   applyFaststart: () => applyFaststart,
   beginFrameCapture: () => beginFrameCapture,
+  blitRgb48leAffine: () => blitRgb48leAffine,
   blitRgb48leRegion: () => blitRgb48leRegion,
   blitRgba8OverRgb48le: () => blitRgba8OverRgb48le,
   buildChromeArgs: () => buildChromeArgs,
@@ -24131,11 +25059,13 @@ __export(src_exports, {
   captureScreenshotWithAlpha: () => captureScreenshotWithAlpha,
   cdpSessionCache: () => cdpSessionCache,
   closeCaptureSession: () => closeCaptureSession,
+  convertTransfer: () => convertTransfer,
   createCaptureSession: () => createCaptureSession,
   createFileServer: () => createFileServer,
   createFrameLookupTable: () => createFrameLookupTable,
   createFrameReorderBuffer: () => createFrameReorderBuffer,
   createVideoFrameInjector: () => createVideoFrameInjector,
+  crossfade: () => crossfade,
   decodePng: () => decodePng,
   decodePngToRgb48le: () => decodePngToRgb48le,
   detectGpuEncoder: () => detectGpuEncoder,
@@ -24159,6 +25089,7 @@ __export(src_exports, {
   getSrgbToHdrLut: () => getSrgbToHdrLut,
   getSystemResources: () => getSystemResources,
   groupIntoLayers: () => groupIntoLayers,
+  hdrToLinear: () => hdrToLinear,
   hideVideoElements: () => hideVideoElements,
   initHdrReadback: () => initHdrReadback,
   initTransparentBackground: () => initTransparentBackground,
@@ -24167,10 +25098,12 @@ __export(src_exports, {
   isHdrColorSpace: () => isHdrColorSpace,
   isHttpUrl: () => isHttpUrl,
   launchHdrBrowser: () => launchHdrBrowser,
+  linearToHdr: () => linearToHdr,
   mergeWorkerFrames: () => mergeWorkerFrames,
   muxVideoWithAudio: () => muxVideoWithAudio,
   pageScreenshotCapture: () => pageScreenshotCapture,
   parseAudioElements: () => parseAudioElements,
+  parseTransformMatrix: () => parseTransformMatrix,
   parseVideoElements: () => parseVideoElements,
   prepareCaptureSessionForReuse: () => prepareCaptureSessionForReuse,
   processCompositionAudio: () => processCompositionAudio,
@@ -24178,8 +25111,12 @@ __export(src_exports, {
   queryElementStacking: () => queryElementStacking,
   queryVideoElementBounds: () => queryVideoElementBounds,
   releaseBrowser: () => releaseBrowser,
+  removeDomLayerMask: () => removeDomLayerMask,
   resolveConfig: () => resolveConfig,
   resolveHeadlessShellPath: () => resolveHeadlessShellPath,
+  roundedRectAlpha: () => roundedRectAlpha,
+  runFfmpeg: () => runFfmpeg,
+  sampleRgb48le: () => sampleRgb48le,
   showVideoElements: () => showVideoElements,
   spawnStreamingEncoder: () => spawnStreamingEncoder,
   syncVideoFrameVisibility: () => syncVideoFrameVisibility,
@@ -24202,8 +25139,10 @@ var init_src2 = __esm({
     init_src();
     init_ffprobe();
     init_urlDownloader();
+    init_runFfmpeg();
     init_alphaBlit();
     init_layerCompositor();
+    init_shaderTransitions();
     init_hdrCapture();
     init_screenshotService();
     init_videoFrameInjector();
@@ -26746,6 +27685,63 @@ function applyRenderModeHints(cfg, compiled, log = defaultLogger) {
     reasons: compiled.renderModeHints.reasons.map((reason) => reason.message)
   });
 }
+function blitHdrVideoLayer(canvas, el, time, fps, hdrFrameDirs, hdrStartTimes, width, height, log, sourceTransfer, targetTransfer) {
+  const frameDir = hdrFrameDirs.get(el.id);
+  const startTime = hdrStartTimes.get(el.id);
+  if (!frameDir || startTime === void 0) {
+    return;
+  }
+  const videoFrameIndex = Math.round((time - startTime) * fps) + 1;
+  if (videoFrameIndex < 1) return;
+  const maxIndex = getMaxFrameIndex(frameDir);
+  const effectiveIndex = maxIndex > 0 ? Math.min(videoFrameIndex, maxIndex) : videoFrameIndex;
+  const framePath = join31(frameDir, `frame_${String(effectiveIndex).padStart(4, "0")}.png`);
+  if (!existsSync28(framePath)) {
+    return;
+  }
+  try {
+    const { data: hdrRgb, width: srcW, height: srcH } = decodePngToRgb48le(readFileSync20(framePath));
+    if (sourceTransfer && targetTransfer && sourceTransfer !== targetTransfer) {
+      convertTransfer(hdrRgb, sourceTransfer, targetTransfer);
+    }
+    const viewportMatrix = parseTransformMatrix(el.transform);
+    const br = el.borderRadius;
+    const hasBorderRadius = br[0] > 0 || br[1] > 0 || br[2] > 0 || br[3] > 0;
+    const borderRadiusParam = hasBorderRadius ? br : void 0;
+    if (viewportMatrix) {
+      blitRgb48leAffine(
+        canvas,
+        hdrRgb,
+        viewportMatrix,
+        srcW,
+        srcH,
+        width,
+        height,
+        el.opacity < 0.999 ? el.opacity : void 0,
+        borderRadiusParam
+      );
+    } else {
+      blitRgb48leRegion(
+        canvas,
+        hdrRgb,
+        el.x,
+        el.y,
+        srcW,
+        srcH,
+        width,
+        height,
+        el.opacity < 0.999 ? el.opacity : void 0,
+        borderRadiusParam
+      );
+    }
+  } catch (err) {
+    if (log) {
+      log.debug(`HDR blit failed for ${el.id}`, {
+        error: err instanceof Error ? err.message : String(err)
+      });
+    }
+  }
+}
 function createRenderJob(config) {
   return {
     id: randomUUID2(),
@@ -27016,6 +28012,7 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
     perfStages.browserProbeMs = Date.now() - probeStart;
     job.duration = composition.duration;
     job.totalFrames = Math.ceil(composition.duration * job.config.fps);
+    const totalFrames = job.totalFrames;
     if (job.duration <= 0) {
       const diagnostics = [];
       try {
@@ -27073,7 +28070,8 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
     const compiledDir = join31(workDir, "compiled");
     let extractionResult = null;
     const nativeHdrVideoIds = /* @__PURE__ */ new Set();
-    if (composition.videos.length > 0) {
+    const videoTransfers = /* @__PURE__ */ new Map();
+    if (job.config.hdr && composition.videos.length > 0) {
       await Promise.all(
         composition.videos.map(async (v) => {
           let videoPath = v.src;
@@ -27085,6 +28083,7 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
           const meta = await extractVideoMetadata(videoPath);
           if (isHdrColorSpace(meta.colorSpace)) {
             nativeHdrVideoIds.add(v.id);
+            videoTransfers.set(v.id, detectTransfer(meta.colorSpace));
           }
         })
       );
@@ -27126,13 +28125,19 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
       perfStages.videoExtractMs = Date.now() - stage2Start;
     }
     let effectiveHdr;
-    if (frameLookup) {
+    if (job.config.hdr && frameLookup) {
       const colorSpaces = (extractionResult?.extracted ?? []).map((ext) => ext.metadata.colorSpace);
       const info = analyzeCompositionHdr(colorSpaces);
       if (info.hasHdr && info.dominantTransfer) {
         effectiveHdr = { transfer: info.dominantTransfer };
       }
     }
+    if (job.config.hdr && !effectiveHdr && nativeHdrVideoIds.size > 0) {
+      const firstTransfer = videoTransfers.values().next().value;
+      if (firstTransfer) {
+        effectiveHdr = { transfer: firstTransfer };
+      }
+    }
     if (effectiveHdr && outputFormat !== "mp4") {
       log.info(`[Render] HDR source detected but format is ${outputFormat} \u2014 using SDR`);
       effectiveHdr = void 0;
@@ -27183,15 +28188,15 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
       format: needsAlpha ? "png" : "jpeg",
       quality: needsAlpha ? void 0 : job.config.quality === "draft" ? 80 : 95
     };
-    const workerCount = calculateOptimalWorkers(job.totalFrames, job.config.workers, cfg);
+    const workerCount = calculateOptimalWorkers(totalFrames, job.config.workers, cfg);
     const FORMAT_EXT2 = { mp4: ".mp4", webm: ".webm", mov: ".mov" };
     const videoExt = FORMAT_EXT2[outputFormat] ?? ".mp4";
     const videoOnlyPath = join31(workDir, `video-only${videoExt}`);
-    const hasHdrVideo = effectiveHdr && composition.videos.length > 0 && frameLookup;
-    const encoderHdr = hasHdrVideo ? effectiveHdr : void 0;
+    const hasHdrContent = effectiveHdr && nativeHdrVideoIds.size > 0;
+    const encoderHdr = hasHdrContent ? effectiveHdr : void 0;
     const preset = getEncoderPreset(job.config.quality, outputFormat, encoderHdr);
     job.framesRendered = 0;
-    if (hasHdrVideo) {
+    if (hasHdrContent) {
       log.info("[Render] HDR layered composite: z-ordered DOM + native HLG video layers");
       const hdrVideoIds = composition.videos.filter((v) => nativeHdrVideoIds.has(v.id)).map((v) => v.id);
       const hdrVideoSrcPaths = /* @__PURE__ */ new Map();
@@ -27204,6 +28209,7 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
         }
         hdrVideoSrcPaths.set(v.id, srcPath);
       }
+      if (!fileServer) throw new Error("fileServer must be initialized before HDR compositing");
       const domSession = await createCaptureSession(
         fileServer.url,
         framesDir,
@@ -27215,6 +28221,34 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
       assertNotAborted();
       lastBrowserConsole = domSession.browserConsoleBuffer;
       await initTransparentBackground(domSession.page);
+      const transitionMeta = await domSession.page.evaluate(() => {
+        return window.__hf?.transitions ?? [];
+      });
+      const sceneElements = await domSession.page.evaluate(() => {
+        const scenes = document.querySelectorAll(".scene");
+        const map = {};
+        for (const scene of scenes) {
+          const els = scene.querySelectorAll("[data-start]");
+          map[scene.id] = Array.from(els).map((e2) => e2.id);
+        }
+        return map;
+      });
+      const transitionRanges = transitionMeta.map((t3) => ({
+        ...t3,
+        startFrame: Math.floor(t3.time * job.config.fps),
+        endFrame: Math.ceil((t3.time + t3.duration) * job.config.fps)
+      }));
+      if (transitionRanges.length > 0) {
+        log.info("[Render] Detected shader transitions for HDR compositing", {
+          count: transitionRanges.length,
+          transitions: transitionRanges.map((t3) => ({
+            shader: t3.shader,
+            from: t3.fromScene,
+            to: t3.toScene,
+            frames: `${t3.startFrame}-${t3.endFrame}`
+          }))
+        });
+      }
       const hdrEncoder = await spawnStreamingEncoder(
         videoOnlyPath,
         {
@@ -27232,7 +28266,28 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
         { ffmpegStreamingTimeout: 36e5 }
       );
       assertNotAborted();
-      const { execSync: execSync5 } = await import("child_process");
+      const hdrExtractionDims = /* @__PURE__ */ new Map();
+      const hdrVideoStartTimes = /* @__PURE__ */ new Map();
+      for (const v of composition.videos) {
+        if (hdrVideoIds.includes(v.id)) {
+          hdrVideoStartTimes.set(v.id, v.start);
+        }
+      }
+      const uniqueStartTimes = [...new Set(hdrVideoStartTimes.values())].sort((a, b) => a - b);
+      for (const seekTime of uniqueStartTimes) {
+        await domSession.page.evaluate((t3) => {
+          if (window.__hf && typeof window.__hf.seek === "function") window.__hf.seek(t3);
+        }, seekTime);
+        if (domSession.onBeforeCapture) {
+          await domSession.onBeforeCapture(domSession.page, seekTime);
+        }
+        const stacking = await queryElementStacking(domSession.page, nativeHdrVideoIds);
+        for (const el of stacking) {
+          if (el.isHdr && el.layoutWidth > 0 && el.layoutHeight > 0 && !hdrExtractionDims.has(el.id)) {
+            hdrExtractionDims.set(el.id, { width: el.layoutWidth, height: el.layoutHeight });
+          }
+        }
+      }
       const hdrFrameDirs = /* @__PURE__ */ new Map();
       for (const [videoId, srcPath] of hdrVideoSrcPaths) {
         const video = composition.videos.find((v) => v.id === videoId);
@@ -27240,24 +28295,190 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
         const frameDir = join31(framesDir, `hdr_${videoId}`);
         mkdirSync17(frameDir, { recursive: true });
         const duration = video.end - video.start;
-        try {
-          execSync5(
-            `ffmpeg -ss ${video.mediaStart} -i "${srcPath}" -t ${duration} -r ${job.config.fps} -vf "scale=${width}:${height}:force_original_aspect_ratio=increase,crop=${width}:${height}" -pix_fmt rgb48le -c:v png "${join31(frameDir, "frame_%04d.png")}"`,
-            { maxBuffer: 1024 * 1024, stdio: ["pipe", "pipe", "pipe"] }
-          );
-        } catch (err) {
+        const dims = hdrExtractionDims.get(videoId) ?? { width, height };
+        const ffmpegArgs = [
+          "-ss",
+          String(video.mediaStart),
+          "-i",
+          srcPath,
+          "-t",
+          String(duration),
+          "-r",
+          String(job.config.fps),
+          "-vf",
+          `scale=${dims.width}:${dims.height}:force_original_aspect_ratio=increase,crop=${dims.width}:${dims.height}`,
+          "-pix_fmt",
+          "rgb48le",
+          "-c:v",
+          "png",
+          "-y",
+          join31(frameDir, "frame_%04d.png")
+        ];
+        const result = await runFfmpeg(ffmpegArgs, { signal: abortSignal });
+        if (!result.success) {
           log.warn("HDR frame pre-extraction failed; loop will fill with black", {
             videoId,
             srcPath,
-            error: err instanceof Error ? err.message : String(err)
+            stderr: result.stderr.slice(-400)
           });
         }
         hdrFrameDirs.set(videoId, frameDir);
       }
       assertNotAborted();
       try {
+        let countNonZeroAlpha2 = function(rgba) {
+          let n = 0;
+          for (let p = 3; p < rgba.length; p += 4) {
+            if (rgba[p] !== 0) n++;
+          }
+          return n;
+        }, countNonZeroRgb482 = function(buf) {
+          let n = 0;
+          for (let p = 0; p < buf.length; p += 6) {
+            if (buf[p] !== 0 || buf[p + 1] !== 0 || buf[p + 2] !== 0) n++;
+          }
+          return n;
+        };
+        var countNonZeroAlpha = countNonZeroAlpha2, countNonZeroRgb48 = countNonZeroRgb482;
         const beforeCaptureHook = domSession.onBeforeCapture;
-        for (let i2 = 0; i2 < job.totalFrames; i2++) {
+        const cleanedUpVideos = /* @__PURE__ */ new Set();
+        const hdrVideoEndTimes = /* @__PURE__ */ new Map();
+        for (const v of composition.videos) {
+          if (hdrFrameDirs.has(v.id)) {
+            hdrVideoEndTimes.set(v.id, v.end);
+          }
+        }
+        const debugDumpEnabled = process.env.KEEP_TEMP === "1";
+        const debugDumpDir = debugDumpEnabled ? join31(framesDir, "debug-composite") : null;
+        if (debugDumpDir && !existsSync28(debugDumpDir)) {
+          mkdirSync17(debugDumpDir, { recursive: true });
+        }
+        async function compositeToBuffer(canvas, time, fullStacking, elementFilter, debugFrameIndex = -1) {
+          const filteredStacking = elementFilter ? fullStacking.filter((e2) => elementFilter.has(e2.id)) : fullStacking;
+          const layers = groupIntoLayers(filteredStacking);
+          const shouldLog = debugDumpEnabled && debugFrameIndex >= 0;
+          if (shouldLog) {
+            log.info("[diag] compositeToBuffer plan", {
+              frame: debugFrameIndex,
+              time: time.toFixed(3),
+              filterSize: elementFilter?.size,
+              fullStackingCount: fullStacking.length,
+              filteredCount: filteredStacking.length,
+              layerCount: layers.length,
+              layers: layers.map(
+                (l) => l.type === "hdr" ? {
+                  type: "hdr",
+                  id: l.element.id,
+                  z: l.element.zIndex,
+                  visible: l.element.visible,
+                  opacity: l.element.opacity,
+                  bounds: `${Math.round(l.element.x)},${Math.round(l.element.y)} ${Math.round(l.element.width)}x${Math.round(l.element.height)}`
+                } : { type: "dom", ids: l.elementIds }
+              )
+            });
+          }
+          for (let layerIdx = 0; layerIdx < layers.length; layerIdx++) {
+            const layer = layers[layerIdx];
+            if (layer.type === "hdr") {
+              const before2 = shouldLog ? countNonZeroRgb482(canvas) : 0;
+              blitHdrVideoLayer(
+                canvas,
+                layer.element,
+                time,
+                job.config.fps,
+                hdrFrameDirs,
+                hdrVideoStartTimes,
+                width,
+                height,
+                log,
+                videoTransfers.get(layer.element.id),
+                effectiveHdr?.transfer
+              );
+              if (shouldLog) {
+                const after2 = countNonZeroRgb482(canvas);
+                const frameDir = hdrFrameDirs.get(layer.element.id);
+                const startTime = hdrVideoStartTimes.get(layer.element.id) ?? 0;
+                const localTime = time - startTime;
+                const frameNum = Math.floor(localTime * job.config.fps) + 1;
+                const expectedFrame = frameDir ? join31(frameDir, `frame_${String(frameNum).padStart(4, "0")}.png`) : null;
+                log.info("[diag] hdr layer blit", {
+                  frame: debugFrameIndex,
+                  layerIdx,
+                  id: layer.element.id,
+                  pixelsAdded: after2 - before2,
+                  totalNonZero: after2,
+                  startTime,
+                  localTime: localTime.toFixed(3),
+                  hdrFrameNum: frameNum,
+                  expectedFrame,
+                  expectedFrameExists: expectedFrame ? existsSync28(expectedFrame) : false
+                });
+              }
+            } else {
+              const allElementIds = fullStacking.map((e2) => e2.id);
+              const layerIds = new Set(layer.elementIds);
+              const hideIds = allElementIds.filter((id) => !layerIds.has(id));
+              await domSession.page.evaluate((t3) => {
+                if (window.__hf && typeof window.__hf.seek === "function") window.__hf.seek(t3);
+              }, time);
+              if (beforeCaptureHook) {
+                await beforeCaptureHook(domSession.page, time);
+              }
+              await applyDomLayerMask(domSession.page, layer.elementIds, hideIds);
+              const domPng = await captureAlphaPng(domSession.page, width, height);
+              await removeDomLayerMask(domSession.page, hideIds);
+              try {
+                const { data: domRgba } = decodePng(domPng);
+                if (!effectiveHdr) {
+                  throw new Error(
+                    "Invariant violation: effectiveHdr is undefined inside HDR layer branch"
+                  );
+                }
+                const before2 = shouldLog ? countNonZeroRgb482(canvas) : 0;
+                const alphaPixels = shouldLog ? countNonZeroAlpha2(domRgba) : 0;
+                blitRgba8OverRgb48le(domRgba, canvas, width, height, effectiveHdr.transfer);
+                if (shouldLog && debugDumpDir) {
+                  const after2 = countNonZeroRgb482(canvas);
+                  const dumpName = `frame_${String(debugFrameIndex).padStart(4, "0")}_layer_${String(layerIdx).padStart(2, "0")}_dom.png`;
+                  const dumpPath = join31(debugDumpDir, dumpName);
+                  writeFileSync10(dumpPath, domPng);
+                  log.info("[diag] dom layer blit", {
+                    frame: debugFrameIndex,
+                    layerIdx,
+                    layerIds: layer.elementIds,
+                    hideCount: hideIds.length,
+                    pngBytes: domPng.length,
+                    alphaPixels,
+                    pixelsAdded: after2 - before2,
+                    totalNonZero: after2,
+                    dumpPath
+                  });
+                }
+              } catch (err) {
+                log.warn("DOM layer decode/blit failed; skipping overlay", {
+                  layerIds: layer.elementIds,
+                  error: err instanceof Error ? err.message : String(err)
+                });
+              }
+            }
+          }
+          if (shouldLog && debugDumpDir) {
+            const finalNonZero = countNonZeroRgb482(canvas);
+            log.info("[diag] compositeToBuffer end", {
+              frame: debugFrameIndex,
+              finalNonZeroPixels: finalNonZero,
+              totalPixels: width * height,
+              coverage: (finalNonZero / (width * height) * 100).toFixed(1) + "%"
+            });
+          }
+        }
+        const bufSize = width * height * 6;
+        const hasTransitions = transitionRanges.length > 0;
+        const transBufferA = hasTransitions ? Buffer.alloc(bufSize) : null;
+        const transBufferB = hasTransitions ? Buffer.alloc(bufSize) : null;
+        const transOutput = hasTransitions ? Buffer.alloc(bufSize) : null;
+        const normalCanvas = Buffer.alloc(bufSize);
+        for (let i2 = 0; i2 < totalFrames; i2++) {
           assertNotAborted();
           const time = i2 / job.config.fps;
           await domSession.page.evaluate((t3) => {
@@ -27267,81 +28488,118 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
             await beforeCaptureHook(domSession.page, time);
           }
           const stackingInfo = await queryElementStacking(domSession.page, nativeHdrVideoIds);
-          const layers = groupIntoLayers(stackingInfo);
+          const activeTransition = transitionRanges.find(
+            (t3) => i2 >= t3.startFrame && i2 <= t3.endFrame
+          );
           if (i2 % 30 === 0) {
             const hdrEl = stackingInfo.find((e2) => e2.isHdr);
-            const hdrInLayers = layers.some((l) => l.type === "hdr");
             log.debug("[Render] HDR layer composite frame", {
               frame: i2,
               time: time.toFixed(2),
               hdrElement: hdrEl ? { z: hdrEl.zIndex, visible: hdrEl.visible, width: hdrEl.width } : null,
-              hdrLayerPresent: hdrInLayers,
-              layerCount: layers.length
+              stackingCount: stackingInfo.length,
+              activeTransition: activeTransition?.shader
             });
           }
-          const canvas = Buffer.alloc(width * height * 6);
-          for (const layer of layers) {
-            if (layer.type === "hdr") {
-              const el = layer.element;
-              const frameDir = hdrFrameDirs.get(el.id);
-              const video = composition.videos.find((v) => v.id === el.id);
-              if (!frameDir || !video) continue;
-              const videoFrameIndex = Math.round((time - video.start) * job.config.fps) + 1;
-              const maxIndex = getMaxFrameIndex(frameDir);
-              const inBounds = videoFrameIndex >= 1 && (maxIndex === 0 || videoFrameIndex <= maxIndex);
-              const framePath = inBounds ? join31(frameDir, `frame_${String(videoFrameIndex).padStart(4, "0")}.png`) : null;
-              if (framePath !== null && existsSync28(framePath)) {
-                try {
-                  const hdrRgb = decodePngToRgb48le(readFileSync20(framePath)).data;
-                  blitRgb48leRegion(
-                    canvas,
-                    hdrRgb,
-                    el.x,
-                    el.y,
-                    el.width,
-                    el.height,
-                    width,
-                    height,
-                    el.opacity < 0.999 ? el.opacity : void 0
-                  );
-                } catch (err) {
-                  log.warn("HDR layer decode/blit failed; skipping layer for frame", {
-                    frameIndex: i2,
-                    videoId: el.id,
-                    framePath,
-                    error: err instanceof Error ? err.message : String(err)
-                  });
-                }
-              }
-            } else {
-              const allElementIds = stackingInfo.map((e2) => e2.id);
-              const layerIds = new Set(layer.elementIds);
-              const hideIds = allElementIds.filter(
-                (id) => !layerIds.has(id) || nativeHdrVideoIds.has(id)
-              );
-              await hideVideoElements(domSession.page, hideIds);
-              const domPng = await captureAlphaPng(domSession.page, width, height);
-              await showVideoElements(domSession.page, hideIds);
+          if (activeTransition && transBufferA && transBufferB && transOutput) {
+            const progress = activeTransition.endFrame === activeTransition.startFrame ? 1 : (i2 - activeTransition.startFrame) / (activeTransition.endFrame - activeTransition.startFrame);
+            const sceneAIds = new Set(sceneElements[activeTransition.fromScene] ?? []);
+            const sceneBIds = new Set(sceneElements[activeTransition.toScene] ?? []);
+            transBufferA.fill(0);
+            transBufferB.fill(0);
+            for (const [sceneBuf, sceneIds] of [
+              [transBufferA, sceneAIds],
+              [transBufferB, sceneBIds]
+            ]) {
               await domSession.page.evaluate((t3) => {
                 if (window.__hf && typeof window.__hf.seek === "function") window.__hf.seek(t3);
               }, time);
+              if (beforeCaptureHook) {
+                await beforeCaptureHook(domSession.page, time);
+              }
+              for (const el of stackingInfo) {
+                if (!el.isHdr || !sceneIds.has(el.id)) continue;
+                blitHdrVideoLayer(
+                  sceneBuf,
+                  el,
+                  time,
+                  job.config.fps,
+                  hdrFrameDirs,
+                  hdrVideoStartTimes,
+                  width,
+                  height,
+                  log,
+                  videoTransfers.get(el.id),
+                  effectiveHdr?.transfer
+                );
+              }
+              const showIds = Array.from(sceneIds);
+              const hideIds = stackingInfo.map((e2) => e2.id).filter((id) => !sceneIds.has(id) || nativeHdrVideoIds.has(id));
+              await applyDomLayerMask(domSession.page, showIds, hideIds);
+              const domPng = await captureAlphaPng(domSession.page, width, height);
+              await removeDomLayerMask(domSession.page, hideIds);
               try {
                 const { data: domRgba } = decodePng(domPng);
-                const hdrTransfer = effectiveHdr ? effectiveHdr.transfer : "hlg";
-                blitRgba8OverRgb48le(domRgba, canvas, width, height, hdrTransfer);
+                if (!effectiveHdr) {
+                  throw new Error(
+                    "Invariant violation: effectiveHdr is undefined inside hasHdrVideo branch"
+                  );
+                }
+                blitRgba8OverRgb48le(
+                  domRgba,
+                  sceneBuf,
+                  width,
+                  height,
+                  effectiveHdr.transfer
+                );
               } catch (err) {
-                log.warn("DOM layer decode/blit failed; skipping overlay for frame", {
+                log.warn("DOM layer decode/blit failed; skipping overlay for transition scene", {
                   frameIndex: i2,
-                  layerIds: layer.elementIds,
+                  sceneIds: Array.from(sceneIds),
                   error: err instanceof Error ? err.message : String(err)
                 });
               }
             }
+            const transitionFn = TRANSITIONS[activeTransition.shader] ?? crossfade;
+            transitionFn(transBufferA, transBufferB, transOutput, width, height, progress);
+            hdrEncoder.writeFrame(transOutput);
+          } else {
+            normalCanvas.fill(0);
+            await compositeToBuffer(normalCanvas, time, stackingInfo, void 0, i2);
+            if (debugDumpEnabled && debugDumpDir && i2 % 30 === 0) {
+              const previewPath = join31(
+                debugDumpDir,
+                `frame_${String(i2).padStart(4, "0")}_final_rgb48le.bin`
+              );
+              writeFileSync10(previewPath, normalCanvas);
+            }
+            hdrEncoder.writeFrame(normalCanvas);
+          }
+          if (process.env.KEEP_TEMP !== "1") {
+            for (const [videoId, endTime] of hdrVideoEndTimes) {
+              if (time > endTime && !cleanedUpVideos.has(videoId)) {
+                const stillNeeded = activeTransition && (sceneElements[activeTransition.fromScene]?.includes(videoId) || sceneElements[activeTransition.toScene]?.includes(videoId));
+                if (!stillNeeded) {
+                  const frameDir = hdrFrameDirs.get(videoId);
+                  if (frameDir) {
+                    try {
+                      rmSync6(frameDir, { recursive: true, force: true });
+                    } catch (err) {
+                      log.warn("Failed to clean up HDR frame directory", {
+                        videoId,
+                        frameDir,
+                        error: err instanceof Error ? err.message : String(err)
+                      });
+                    }
+                  }
+                  cleanedUpVideos.add(videoId);
+                }
+              }
+            }
           }
-          hdrEncoder.writeFrame(canvas);
           job.framesRendered = i2 + 1;
-          if ((i2 + 1) % 10 === 0 || i2 + 1 === job.totalFrames) {
-            const frameProgress = (i2 + 1) / job.totalFrames;
+          if ((i2 + 1) % 10 === 0 || i2 + 1 === totalFrames) {
+            const frameProgress = (i2 + 1) / totalFrames;
             updateJobStatus(
               job,
               "rendering",
@@ -27384,7 +28642,7 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
         assertNotAborted();
       }
       if (enableStreamingEncode && streamingEncoder) {
-        const reorderBuffer = createFrameReorderBuffer(0, job.totalFrames);
+        const reorderBuffer = createFrameReorderBuffer(0, totalFrames);
         const currentEncoder = streamingEncoder;
         if (workerCount > 1) {
           const tasks = distributeFrames(job.totalFrames, workerCount, workDir);
@@ -27441,7 +28699,7 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
             }
             assertNotAborted();
             lastBrowserConsole = session.browserConsoleBuffer;
-            for (let i2 = 0; i2 < job.totalFrames; i2++) {
+            for (let i2 = 0; i2 < totalFrames; i2++) {
               assertNotAborted();
               const time = i2 / job.config.fps;
               const { buffer } = await captureFrameToBuffer(session, i2, time);
@@ -27449,7 +28707,7 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
               currentEncoder.writeFrame(buffer);
               reorderBuffer.advanceTo(i2 + 1);
               job.framesRendered = i2 + 1;
-              const frameProgress = (i2 + 1) / job.totalFrames;
+              const frameProgress = (i2 + 1) / totalFrames;
               const progress = 25 + frameProgress * 55;
               updateJobStatus(
                 job,
@@ -27622,12 +28880,12 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
       chunkedEncode: enableChunkedEncode,
       chunkSizeFrames: enableChunkedEncode ? chunkedEncodeSize : null,
       compositionDurationSeconds: composition.duration,
-      totalFrames: job.totalFrames,
+      totalFrames,
       resolution: { width, height },
       videoCount: composition.videos.length,
       audioCount: composition.audios.length,
       stages: perfStages,
-      captureAvgMs: job.totalFrames > 0 ? Math.round((perfStages.captureMs ?? 0) / job.totalFrames) : void 0
+      captureAvgMs: totalFrames > 0 ? Math.round((perfStages.captureMs ?? 0) / totalFrames) : void 0
     };
     job.perfSummary = perfSummary;
     if (job.config.debug) {
@@ -27645,6 +28903,8 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
         const debugOutput = join31(workDir, `output${videoExt}`);
         copyFileSync2(outputPath, debugOutput);
       }
+    } else if (process.env.KEEP_TEMP === "1") {
+      log.info("KEEP_TEMP=1 \u2014 leaving workDir on disk for inspection", { workDir });
     } else {
       await safeCleanup(
         "remove workDir",
@@ -30444,9 +31704,7 @@ async function renderDocker(projectDir, outputPath, options) {
     "--workers",
     String(options.workers),
     ...options.quiet ? ["--quiet"] : [],
-    ...options.gpu ? ["--gpu"] : [],
-    ...options.crf != null ? ["--crf", String(options.crf)] : [],
-    ...options.videoBitrate ? ["--video-bitrate", options.videoBitrate] : []
+    ...options.gpu ? ["--gpu"] : []
   ];
   if (!options.quiet) {
     console.log(c.dim("  Running render in Docker container..."));
@@ -30491,8 +31749,7 @@ async function renderLocal(projectDir, outputPath, options) {
     format: options.format,
     workers: options.workers,
     useGpu: options.gpu,
-    crf: options.crf,
-    videoBitrate: options.videoBitrate
+    hdr: options.hdr
   });
   const onProgress = options.quiet ? void 0 : (progressJob, message) => {
     renderProgress(progressJob.progress, message);
@@ -30581,10 +31838,9 @@ var init_render2 = __esm({
       ["Render transparent overlay (ProRes)", "hyperframes render --format mov --output overlay.mov"],
       ["Render transparent WebM overlay", "hyperframes render --format webm --output overlay.webm"],
       ["High quality at 60fps", "hyperframes render --fps 60 --quality high --output hd.mp4"],
-      ["Custom CRF for maximum quality", "hyperframes render --crf 15 --output pristine.mp4"],
-      ["Target bitrate encoding", "hyperframes render --video-bitrate 10M --output hq.mp4"],
       ["Deterministic render via Docker", "hyperframes render --docker --output deterministic.mp4"],
-      ["Parallel rendering with 6 workers", "hyperframes render --workers 6 --output fast.mp4"]
+      ["Parallel rendering with 6 workers", "hyperframes render --workers 6 --output fast.mp4"],
+      ["HDR output (H.265 10-bit)", "hyperframes render --hdr --output hdr-output.mp4"]
     ];
     VALID_FPS = /* @__PURE__ */ new Set([24, 30, 60]);
     VALID_QUALITY = /* @__PURE__ */ new Set(["draft", "standard", "high"]);
@@ -30630,13 +31886,10 @@ var init_render2 = __esm({
           description: "Use Docker for deterministic render",
           default: false
         },
-        crf: {
-          type: "string",
-          description: "CRF (Constant Rate Factor) for the video encoder. Lower = higher quality / larger file. Range: 0\u201351 for H.264. Overrides the quality preset CRF. Cannot be used with --video-bitrate."
-        },
-        "video-bitrate": {
-          type: "string",
-          description: "Target video bitrate (e.g. '10M', '5000k'). Uses bitrate-based encoding instead of CRF. Cannot be used with --crf."
+        hdr: {
+          type: "boolean",
+          description: "Enable HDR: probe sources for PQ/HLG, output H.265 10-bit BT.2020",
+          default: false
         },
         gpu: { type: "boolean", description: "Use GPU encoding", default: false },
         quiet: {
@@ -30679,34 +31932,6 @@ var init_render2 = __esm({
           process.exit(1);
         }
         const format = formatRaw;
-        let crf;
-        let videoBitrate;
-        if (args.crf != null && args["video-bitrate"] != null) {
-          errorBox(
-            "Conflicting options",
-            "--crf and --video-bitrate cannot be used together. Choose one."
-          );
-          process.exit(1);
-        }
-        if (args.crf != null) {
-          const parsed = parseInt(args.crf, 10);
-          if (isNaN(parsed) || parsed < 0 || parsed > 51) {
-            errorBox("Invalid CRF", `Got "${args.crf}". Must be a number between 0 and 51.`);
-            process.exit(1);
-          }
-          crf = parsed;
-        }
-        if (args["video-bitrate"] != null) {
-          const raw = args["video-bitrate"];
-          if (!/^\d+(\.\d+)?[kKM]$/.test(raw)) {
-            errorBox(
-              "Invalid video bitrate",
-              `Got "${raw}". Must be a number followed by k, K, or M (e.g. "10M", "5000k", "1.5M").`
-            );
-            process.exit(1);
-          }
-          videoBitrate = raw;
-        }
         let workers;
         if (args.workers != null && args.workers !== "auto") {
           const parsed = parseInt(args.workers, 10);
@@ -30746,8 +31971,7 @@ var init_render2 = __esm({
           console.log(
             c.accent("\u25C6") + "  Rendering " + c.accent(project.name) + c.dim(" \u2192 " + outputPath)
           );
-          const encodeLabel = videoBitrate ? `bitrate ${videoBitrate}` : crf != null ? `crf ${crf}` : quality;
-          console.log(c.dim("   " + fps + "fps \xB7 " + encodeLabel + " \xB7 " + workerLabel));
+          console.log(c.dim("   " + fps + "fps \xB7 " + quality + " \xB7 " + workerLabel));
           console.log("");
         }
         if (!useDocker) {
@@ -30817,9 +32041,8 @@ var init_render2 = __esm({
             format,
             workers: workerCount,
             gpu: useGpu,
-            quiet,
-            crf,
-            videoBitrate
+            hdr: args.hdr ?? false,
+            quiet
           });
         } else {
           await renderLocal(project.dir, outputPath, {
@@ -30828,10 +32051,9 @@ var init_render2 = __esm({
             format,
             workers: workerCount,
             gpu: useGpu,
+            hdr: args.hdr ?? false,
             quiet,
-            browserPath,
-            crf,
-            videoBitrate
+            browserPath
           });
         }
       }
@@ -34125,9 +35347,9 @@ async function saveLottieAnimations(discoveredLotties, lottieDir) {
               jsonData = animEntry.getData().toString("utf-8");
             }
           } catch {
-            const hash = buf.toString("base64").slice(0, 100);
-            if (savedHashes.has(hash)) continue;
-            savedHashes.add(hash);
+            const hash2 = buf.toString("base64").slice(0, 100);
+            if (savedHashes.has(hash2)) continue;
+            savedHashes.add(hash2);
             writeFileSync18(join47(lottieDir, `animation-${savedCount}.lottie`), buf);
             savedCount++;
             continue;
@@ -34137,9 +35359,9 @@ async function saveLottieAnimations(discoveredLotties, lottieDir) {
         }
       }
       if (jsonData) {
-        const hash = jsonData.slice(0, 200);
-        if (savedHashes.has(hash)) continue;
-        savedHashes.add(hash);
+        const hash2 = jsonData.slice(0, 200);
+        if (savedHashes.has(hash2)) continue;
+        savedHashes.add(hash2);
         try {
           const parsed = JSON.parse(jsonData);
           if (!parsed.layers || !parsed.w) continue;
@@ -35368,12 +36590,12 @@ var require_common2 = __commonJS({
       createDebug.skips = [];
       createDebug.formatters = {};
       function selectColor(namespace) {
-        let hash = 0;
+        let hash2 = 0;
         for (let i2 = 0; i2 < namespace.length; i2++) {
-          hash = (hash << 5) - hash + namespace.charCodeAt(i2);
-          hash |= 0;
+          hash2 = (hash2 << 5) - hash2 + namespace.charCodeAt(i2);
+          hash2 |= 0;
         }
-        return createDebug.colors[Math.abs(hash) % createDebug.colors.length];
+        return createDebug.colors[Math.abs(hash2) % createDebug.colors.length];
       }
       createDebug.selectColor = selectColor;
       function createDebug(namespace) {
@@ -42315,8 +43537,8 @@ var init_get_search = __esm({
         return parsedURL.search;
       }
       const lastOffset = parsedURL.href.length - 1;
-      const hash = parsedURL.hash || (parsedURL.href[lastOffset] === "#" ? "#" : "");
-      return parsedURL.href[lastOffset - hash.length] === "?" ? "?" : "";
+      const hash2 = parsedURL.hash || (parsedURL.href[lastOffset] === "#" ? "#" : "");
+      return parsedURL.href[lastOffset - hash2.length] === "?" ? "?" : "";
     };
   }
 });