{
  "beforeRevision": "70b8f9069dec3d1c39a04d755521ebe6bd252aab",
  "afterRevision": "290c2368052c2c54f67c95c421390b9e45356b72",
  "builds": {
    "before": "c73929d5131944fc",
    "after": "8b2236968d5f6516"
  },
  "agentServer": "1.56.0",
  "sdk": "1.56.0",
  "agentCanvas": "1.30.0",
  "automation": "1.22.0",
  "cliNodeVersion": "v24.22.1",
  "implementation": {
    "layoutOnly": true,
    "intendedVisualRedesign": false,
    "sourcePath": "src/components/features/files-tab/tree-node.tsx",
    "change": "Move depth indentation from inline declarations to the CSS recipe. Folder padding remains 8 + depth \u00d7 12 px; files add 16 px."
  },
  "scope": {
    "themes": [
      "OpenHands-Neutral",
      "Light+",
      "OpenHands-DeepSea"
    ],
    "viewports": [
      "1440\u00d71000 desktop",
      "390\u00d7844 phone"
    ],
    "selectedScreenshots": 40,
    "selectedRawClips": 8,
    "layoutOnly": true
  },
  "comparisonSummary": {
    "workspaceStatePairs": 24,
    "workspaceRawDifferences": 0,
    "pluginDesktopStatePairs": 6,
    "pluginDesktopRawDifferences": 0,
    "pluginPhoneStatePairs": 6,
    "pluginPhoneStatesWithDocumentedRowYShift": 6,
    "documentedPluginPhoneRowYShiftPx": 16,
    "rawStatePairs": 36,
    "rawStatePairsWithDifferences": 6,
    "indentationAndContentContractPairs": 36,
    "changedIndentationAndContentContractPairs": 0,
    "controlPairs": 24,
    "changedControlPairs": 0,
    "folderBasePx": 8,
    "perDepthPx": 12,
    "additionalFilePx": 16,
    "actionEventCountPerPhase": 0
  },
  "limits": [
    "The source recordings retain original control-openhands playback timing, with no editorial speed change. CLI summary duration is rounded; exact container duration, frame count and capture counters are recorded for every original. Video is evidence of the control sequence, not a finer-grained timing instrument.",
    "Coverage is standalone Local Canvas in Neutral, Light+ and DeepSea at 1440\u00d71000 desktop and 390\u00d7844 phone. No Cloud, ACP, all-five-theme or arbitrary embedded-host pass is claimed.",
    "Editorial labels and title cards are distinct from real app viewports. Actual UI pixels, including normal displayed temporary paths, are unretouched; public JSON omits local machine paths.",
    "Initial After captures with the expanded Getting started checklist are superseded. Final selected sources use the real UI to collapse the checklist before replay.",
    "Real conversation titles, Thinking content and elapsed labels differ naturally between bounded DeepSeek turns. No pixel-identity claim is made.",
    "In all six plugin-phone states, the After run-cache path wraps into four lines versus three Before. It adds 16 px above the tree. Raw row-Y differences are retained; relative indentation, row width/height/X, colors, selection, file content and controls match.",
    "The 30 fps film duplicates frames from the 15 fps source recordings. It adds no motion samples and makes no finer timing claim. The full workspace-phone clips are available as originals; the short film selects the plugin-phone clips."
  ],
  "captureProvenance": "file-tree-indentation-capture-provenance.json",
  "captureProvenanceSha256": "d530144d1142091fbf5db4b6b0d09f4d285b2aa99a71f8408ff1bad8dc6240b6",
  "evidenceDownload": "file-tree-indentation-evidence.zip",
  "evidenceDownloadSha256": "6912f573baf41c43a1335ab0783272128b7cbb27c6f85b4e37ae8b15b24576eb",
  "pullRequest": "https://github.com/OpenHands/OpenHands/pull/18804",
  "page": "https://enyst.github.io/arch/agentic-linting-refactoring.html#file-tree-indentation-film",
  "directDownload": "https://enyst.github.io/experiments/agentic-linting-refactoring/file-tree-indentation-before-after.mp4",
  "title": "File tree indentation",
  "recipeSha256": "223505f6b2c8119b933b8a76be2d15c7867405966d20966b28f89b6821cc7894",
  "film": {
    "file": "file-tree-indentation-before-after.mp4",
    "dimensions": [
      1440,
      1120
    ],
    "durationSeconds": 31.8,
    "framesPerSecond": 30,
    "source": "Authentic control-openhands browser receipts. Complete app viewports are established before any explicitly labeled actual screenshot Detail crops. Title cards and banners are editorial labels, not execution proof.",
    "scenes": [
      {
        "phase": "before",
        "kind": "recording",
        "publicSourcePath": "file-tree-indentation-before-tree-desktop-raw.mp4",
        "label": "Before \u00b7 Inline indent",
        "subtitle": "Files \u00b7 Same depth spacing",
        "caption": "Before: Actual Files drawer expand, select, collapse and reopen controls. Complete original clip; no editorial speed change.",
        "head": "70b8f9069dec3d1c39a04d755521ebe6bd252aab",
        "servedBuildFingerprint": "c73929d5131944fc",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "sampling": "Source 15 fps frames duplicated at 30 fps; no added motion samples.",
        "source": "file-tree-indentation-before-tree-desktop-raw.mp4",
        "sourceSha256": "db844c04c463cd881f9ff1aad6e469f191e8a40714c25d5a8200d405d9c7359c",
        "sourceBytes": 63956,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          1.467,
          5.467
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 4.0,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "after",
        "kind": "recording",
        "publicSourcePath": "file-tree-indentation-after-tree-desktop-raw.mp4",
        "label": "After \u00b7 CSS indent",
        "subtitle": "Files \u00b7 Same depth spacing",
        "caption": "After: Actual Files drawer expand, select, collapse and reopen controls. Complete original clip; no editorial speed change.",
        "head": "290c2368052c2c54f67c95c421390b9e45356b72",
        "servedBuildFingerprint": "8b2236968d5f6516",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "sampling": "Source 15 fps frames duplicated at 30 fps; no added motion samples.",
        "source": "file-tree-indentation-after-tree-desktop-raw.mp4",
        "sourceSha256": "83330234e30f4a601cd83efe63e9ac9950cbe132ec4a4b892b3a6566f7364578",
        "sourceBytes": 63407,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          5.467,
          10.133
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 4.666667,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "before",
        "kind": "recording",
        "publicSourcePath": "file-tree-indentation-before-plugin-desktop-raw.mp4",
        "label": "Before \u00b7 Inline indent",
        "subtitle": "Plugin files \u00b7 Same depth spacing",
        "caption": "Before: Actual plugin file-browser expand, select and collapse controls. Complete original clip; no editorial speed change.",
        "head": "70b8f9069dec3d1c39a04d755521ebe6bd252aab",
        "servedBuildFingerprint": "c73929d5131944fc",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "sampling": "Source 15 fps frames duplicated at 30 fps; no added motion samples.",
        "source": "file-tree-indentation-before-plugin-desktop-raw.mp4",
        "sourceSha256": "b8b534838fbbb9b4abd8ace90192c1f89588166c10841cab6fdac63774a478c8",
        "sourceBytes": 192540,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          10.133,
          13.333
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 3.2,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "after",
        "kind": "recording",
        "publicSourcePath": "file-tree-indentation-after-plugin-desktop-raw.mp4",
        "label": "After \u00b7 CSS indent",
        "subtitle": "Plugin files \u00b7 Same depth spacing",
        "caption": "After: Actual plugin file-browser expand, select and collapse controls. Complete original clip; no editorial speed change.",
        "head": "290c2368052c2c54f67c95c421390b9e45356b72",
        "servedBuildFingerprint": "8b2236968d5f6516",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "sampling": "Source 15 fps frames duplicated at 30 fps; no added motion samples.",
        "source": "file-tree-indentation-after-plugin-desktop-raw.mp4",
        "sourceSha256": "f737b9a0bbdf71bcefdb9222a78bc5df39f08221be7fd22dfd96b44dfd45ff32",
        "sourceBytes": 203153,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          13.333,
          16.333
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 3.0,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "before",
        "kind": "recording",
        "publicSourcePath": "file-tree-indentation-before-plugin-phone-raw.mp4",
        "label": "Before \u00b7 Inline indent",
        "subtitle": "Phone \u00b7 Run-path wrap differs",
        "caption": "Before: Actual plugin phone controls. After source path wraps to four lines rather than three; tree rows move 16 px, while relative indentation is retained. Complete original clip; no editorial speed change.",
        "head": "70b8f9069dec3d1c39a04d755521ebe6bd252aab",
        "servedBuildFingerprint": "c73929d5131944fc",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "sampling": "Source 15 fps frames duplicated at 30 fps; no added motion samples.",
        "source": "file-tree-indentation-before-plugin-phone-raw.mp4",
        "sourceSha256": "87e70ea6445ceb22ebf9713c63e4cd8695f83f9a38884952dd7b732a69db2c7c",
        "sourceBytes": 125816,
        "sourceDimensions": [
          390,
          844
        ],
        "timelineSeconds": [
          16.333,
          19.0
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 2.666667,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "after",
        "kind": "recording",
        "publicSourcePath": "file-tree-indentation-after-plugin-phone-raw.mp4",
        "label": "After \u00b7 CSS indent",
        "subtitle": "Phone \u00b7 Run-path wrap differs",
        "caption": "After: Actual plugin phone controls. After source path wraps to four lines rather than three; tree rows move 16 px, while relative indentation is retained. Complete original clip; no editorial speed change.",
        "head": "290c2368052c2c54f67c95c421390b9e45356b72",
        "servedBuildFingerprint": "8b2236968d5f6516",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "sampling": "Source 15 fps frames duplicated at 30 fps; no added motion samples.",
        "source": "file-tree-indentation-after-plugin-phone-raw.mp4",
        "sourceSha256": "f5d417d8e3aa80e72fb52d1b3185471c287058f14945a1156b6875864b79d35a",
        "sourceBytes": 118092,
        "sourceDimensions": [
          390,
          844
        ],
        "timelineSeconds": [
          19.0,
          21.8
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 2.8,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "before",
        "kind": "screenshot",
        "publicSourcePath": "file-tree-indentation-evidence/tree/before-light-plus-desktop-deep-file-selected.png",
        "label": "Before \u00b7 Inline indent",
        "subtitle": "Light+ \u00b7 Full Files context",
        "caption": "Before: full actual Files context before the detail crop. File selection and depth spacing are retained; natural conversation text differs.",
        "head": "70b8f9069dec3d1c39a04d755521ebe6bd252aab",
        "servedBuildFingerprint": "c73929d5131944fc",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "source": "file-tree-indentation-evidence/tree/before-light-plus-desktop-deep-file-selected.png",
        "sourceSha256": "a7d26bbcfc4df4f605b194dc1b05702a0ac2bf201cba1437a2ac94df53c57b44",
        "sourceBytes": 74044,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          21.8,
          23.8
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 2.0
      },
      {
        "phase": "after",
        "kind": "screenshot",
        "publicSourcePath": "file-tree-indentation-evidence/tree/after-light-plus-desktop-deep-file-selected-2.png",
        "label": "After \u00b7 CSS indent",
        "subtitle": "Light+ \u00b7 Full Files context",
        "caption": "After: full actual Files context before the detail crop. File selection and depth spacing are retained; natural conversation text differs.",
        "head": "290c2368052c2c54f67c95c421390b9e45356b72",
        "servedBuildFingerprint": "8b2236968d5f6516",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "source": "file-tree-indentation-evidence/tree/after-light-plus-desktop-deep-file-selected-2.png",
        "sourceSha256": "3f41b2b1dd9a230b2e94b6fc01e503881df1372b1e33b65258b52544a9f17566",
        "sourceBytes": 73661,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          23.8,
          25.8
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 2.0
      },
      {
        "phase": "before",
        "kind": "screenshot",
        "publicSourcePath": "file-tree-indentation-before-files-detail.png",
        "label": "Before \u00b7 Inline indent",
        "subtitle": "Detail \u00b7 Same depth spacing",
        "caption": "Before: actual Files tree detail. Folder padding is 8 + depth \u00d7 12 px; file padding adds 16 px. Layout-only CSS migration, no intended redesign.",
        "head": "70b8f9069dec3d1c39a04d755521ebe6bd252aab",
        "servedBuildFingerprint": "c73929d5131944fc",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "actualDetailCrop": true,
        "detailOf": "file-tree-indentation-evidence/tree/before-light-plus-desktop-deep-file-selected.png",
        "detailOfSha256": "a7d26bbcfc4df4f605b194dc1b05702a0ac2bf201cba1437a2ac94df53c57b44",
        "detailCropPixels": [
          870,
          100,
          570,
          250
        ],
        "source": "file-tree-indentation-before-files-detail.png",
        "sourceSha256": "db579eab902d68f5651a487a2e63e60fdf445619c0497a1c1265925a5c8cc102",
        "sourceBytes": 14863,
        "sourceDimensions": [
          570,
          250
        ],
        "timelineSeconds": [
          25.8,
          28.8
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Actual screenshot detail crop, proportionally enlarged below a separate editorial banner; full viewport established earlier.",
        "stillOrHeldSeconds": 3.0
      },
      {
        "phase": "after",
        "kind": "screenshot",
        "publicSourcePath": "file-tree-indentation-after-files-detail.png",
        "label": "After \u00b7 CSS indent",
        "subtitle": "Detail \u00b7 Same depth spacing",
        "caption": "After: actual Files tree detail. Folder padding is 8 + depth \u00d7 12 px; file padding adds 16 px. Layout-only CSS migration, no intended redesign.",
        "head": "290c2368052c2c54f67c95c421390b9e45356b72",
        "servedBuildFingerprint": "8b2236968d5f6516",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "actualDetailCrop": true,
        "detailOf": "file-tree-indentation-evidence/tree/after-light-plus-desktop-deep-file-selected-2.png",
        "detailOfSha256": "3f41b2b1dd9a230b2e94b6fc01e503881df1372b1e33b65258b52544a9f17566",
        "detailCropPixels": [
          870,
          100,
          570,
          250
        ],
        "source": "file-tree-indentation-after-files-detail.png",
        "sourceSha256": "db579eab902d68f5651a487a2e63e60fdf445619c0497a1c1265925a5c8cc102",
        "sourceBytes": 14863,
        "sourceDimensions": [
          570,
          250
        ],
        "timelineSeconds": [
          28.8,
          31.8
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Actual screenshot detail crop, proportionally enlarged below a separate editorial banner; full viewport established earlier.",
        "stillOrHeldSeconds": 3.0
      }
    ],
    "chapters": [
      {
        "from": 0,
        "to": 1.4666666666666666,
        "kind": "presentation-title",
        "caption": "File tree indentation"
      },
      {
        "from": 1.4666666666666666,
        "to": 5.466666666666667,
        "kind": "recording",
        "caption": "Before: Actual Files drawer expand, select, collapse and reopen controls. Complete original clip; no editorial speed change."
      },
      {
        "from": 5.466666666666667,
        "to": 10.133333333333333,
        "kind": "recording",
        "caption": "After: Actual Files drawer expand, select, collapse and reopen controls. Complete original clip; no editorial speed change."
      },
      {
        "from": 10.133333333333333,
        "to": 13.333333333333332,
        "kind": "recording",
        "caption": "Before: Actual plugin file-browser expand, select and collapse controls. Complete original clip; no editorial speed change."
      },
      {
        "from": 13.333333333333332,
        "to": 16.333333333333332,
        "kind": "recording",
        "caption": "After: Actual plugin file-browser expand, select and collapse controls. Complete original clip; no editorial speed change."
      },
      {
        "from": 16.333333333333332,
        "to": 19.0,
        "kind": "recording",
        "caption": "Before: Actual plugin phone controls. After source path wraps to four lines rather than three; tree rows move 16 px, while relative indentation is retained. Complete original clip; no editorial speed change."
      },
      {
        "from": 19.0,
        "to": 21.8,
        "kind": "recording",
        "caption": "After: Actual plugin phone controls. After source path wraps to four lines rather than three; tree rows move 16 px, while relative indentation is retained. Complete original clip; no editorial speed change."
      },
      {
        "from": 21.8,
        "to": 23.8,
        "kind": "screenshot",
        "caption": "Before: full actual Files context before the detail crop. File selection and depth spacing are retained; natural conversation text differs."
      },
      {
        "from": 23.8,
        "to": 25.8,
        "kind": "screenshot",
        "caption": "After: full actual Files context before the detail crop. File selection and depth spacing are retained; natural conversation text differs."
      },
      {
        "from": 25.8,
        "to": 28.8,
        "kind": "screenshot",
        "caption": "Before: actual Files tree detail. Folder padding is 8 + depth \u00d7 12 px; file padding adds 16 px. Layout-only CSS migration, no intended redesign."
      },
      {
        "from": 28.8,
        "to": 31.8,
        "kind": "screenshot",
        "caption": "After: actual Files tree detail. Folder padding is 8 + depth \u00d7 12 px; file padding adds 16 px. Layout-only CSS migration, no intended redesign."
      }
    ],
    "ambience": {
      "origin": "Original synthesized ambient pad; no external samples or provider.",
      "frequenciesHz": [
        174.61,
        220,
        261.63
      ],
      "amplitude": 0.004,
      "fadeInSeconds": 1.5,
      "fadeOutSeconds": 2,
      "meanDbfs": -52.6,
      "peakDbfs": -42.9,
      "applicationAudio": false
    }
  },
  "preview": {
    "file": "file-tree-indentation-before-after.gif",
    "durationSeconds": 30.25,
    "dimensions": [
      864,
      672
    ],
    "audio": false,
    "limitation": "Scaled silent preview; use the MP4 or original screenshots for small UI details."
  },
  "files": {
    "file-tree-indentation-before-after.mp4": {
      "sha256": "df3479189febf3545420d7a824b27a2d6a0dbafe3d3b76be378d02dc29c0912f",
      "bytes": 1360804
    },
    "file-tree-indentation-poster.jpg": {
      "sha256": "4ca4a165bd3fe5f22e25fff94c70a6d3d585fb4be71ec4822fff36fb4682dab8",
      "bytes": 54722
    },
    "file-tree-indentation-captions.vtt": {
      "sha256": "72bc9713a0472885ac6450473de1fc4a10f02481a7ab1336ff4d2a5dbb4533e0",
      "bytes": 1851
    },
    "file-tree-indentation-before-after.gif": {
      "sha256": "2c83a87a7c5d7a7057dad66109d1bbad84bef24b4f76f9811bc3426218cb3984",
      "bytes": 1820909
    }
  }
}