@kitschpatrol/tldraw-cli 3.2.0 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/bin/cli.js +274 -157
  2. package/dist/.DS_Store +0 -0
  3. package/dist/lib/index.d.ts +2 -1
  4. package/dist/lib/index.js +130 -79
  5. package/dist/lib/tldraw-controller.d.ts +2 -0
  6. package/dist/lib/tldraw-to-image.d.ts +1 -2
  7. package/dist/lib/utilities/log.d.ts +12 -0
  8. package/dist/tldraw/assets/index-1gkReWLJ.css +1 -0
  9. package/dist/tldraw/assets/index-R37c2LB5.js +315 -0
  10. package/dist/tldraw/icons/icon/checkbox-empty.svg +1 -1
  11. package/dist/tldraw/index.html +2 -2
  12. package/dist/tldraw/translations/main.json +3 -0
  13. package/package.json +9 -9
  14. package/readme.md +34 -19
  15. package/dist/tldraw/assets/index-S3CdIkLU.css +0 -1
  16. package/dist/tldraw/assets/index-l3509weP.js +0 -315
package/dist/tldraw/icons/icon/checkbox-empty.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="none"><path stroke="#000" stroke-opacity=".5" stroke-width="2" d="M8 8h14v14H8z"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="none"><path stroke="#000" stroke-width="3" d="M7.276 5.496h17.509a1.72 1.72 0 0 1 1.72 1.72v17.508a1.78 1.78 0 0 1-1.78 1.78H7.402a1.907 1.907 0 0 1-1.907-1.907V7.276a1.78 1.78 0 0 1 1.78-1.78z"/></svg>
package/dist/tldraw/index.html CHANGED
@@ -4,8 +4,8 @@
4
4
  <meta charset="UTF-8" />
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
6
  <title>tldraw via tldraw-cli</title>
7
- <script type="module" crossorigin src="/assets/index-l3509weP.js"></script>
8
- <link rel="stylesheet" crossorigin href="/assets/index-S3CdIkLU.css">
7
+ <script type="module" crossorigin src="/assets/index-R37c2LB5.js"></script>
8
+ <link rel="stylesheet" crossorigin href="/assets/index-1gkReWLJ.css">
9
9
  </head>
10
10
  <body>
11
11
  <div id="root"></div>
package/dist/tldraw/translations/main.json CHANGED
@@ -137,6 +137,9 @@
137
137
  "align-style.middle": "Middle",
138
138
  "align-style.end": "End",
139
139
  "align-style.justify": "Justify",
140
+ "verticalAlign-style.start": "Top",
141
+ "verticalAlign-style.middle": "Middle",
142
+ "verticalAlign-style.end": "Bottom",
140
143
  "geo-style.arrow-down": "Arrow down",
141
144
  "geo-style.arrow-left": "Arrow left",
142
145
  "geo-style.arrow-right": "Arrow right",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kitschpatrol/tldraw-cli",
3
- "version": "3.2.0",
3
+ "version": "4.0.0",
4
4
  "type": "module",
5
5
  "description": "A tiny little CLI tool for exporting tldraw sketches to svg or png images.",
6
6
  "repository": {
@@ -43,26 +43,26 @@
43
43
  ],
44
44
  "dependencies": {
45
45
  "express": "^4.18.2",
46
- "puppeteer": "^21.7.0"
46
+ "puppeteer": "^22.0.0"
47
47
  },
48
48
  "devDependencies": {
49
49
  "@kitschpatrol/shared-config": "^4.3.3",
50
50
  "@sindresorhus/slugify": "^2.2.1",
51
- "@tldraw/assets": "2.0.0-canary.ade38247d8a4",
52
- "@tldraw/tldraw": "2.0.0-canary.ade38247d8a4",
51
+ "@tldraw/assets": "2.0.0-canary.e6e4e7f6cbac",
52
+ "@tldraw/tldraw": "2.0.0-canary.e6e4e7f6cbac",
53
53
  "@types/express": "^4.17.21",
54
- "@types/react": "^18.2.48",
54
+ "@types/react": "^18.2.53",
55
55
  "@types/react-dom": "^18.2.18",
56
56
  "@types/yargs": "^17.0.32",
57
- "@vitejs/plugin-react-swc": "^3.5.0",
57
+ "@vitejs/plugin-react-swc": "^3.6.0",
58
58
  "bumpp": "^9.3.0",
59
59
  "chalk": "^5.3.0",
60
60
  "cheerio": "1.0.0-rc.12",
61
- "esbuild": "^0.19.11",
61
+ "esbuild": "^0.20.0",
62
62
  "eslint-plugin-react-hooks": "^4.6.0",
63
63
  "eslint-plugin-react-refresh": "^0.4.5",
64
64
  "get-port": "^7.0.0",
65
- "nanoid": "^5.0.4",
65
+ "nanoid": "^5.0.5",
66
66
  "open": "^10.0.3",
67
67
  "path-type": "^5.0.0",
68
68
  "plur": "^5.1.0",
@@ -73,7 +73,7 @@
73
73
  "typescript": "^5.3.3",
74
74
  "untildify": "^5.0.0",
75
75
  "vite": "^5.0.12",
76
- "vitest": "^1.2.1",
76
+ "vitest": "^1.2.2",
77
77
  "yargs": "^17.7.2"
78
78
  },
79
79
  "publishConfig": {
package/readme.md CHANGED
@@ -48,7 +48,7 @@ The top-level collection of CLI tools for tldraw.
48
48
  | --------- | ----------------------------------------------------------------- |
49
49
  | `command` | CLI tools for tldraw. Available commands are `export` and `open`. |
50
50
 
51
- | Option | Alias | Description Value |
51
+ | Option | Alias | Description |
52
52
  | ----------- | ----- | -------------------- |
53
53
  | `--help ` | `-h` | Show help. |
54
54
  | `--version` | `-v` | Show version number. |
@@ -65,17 +65,17 @@ Export a tldraw `.tldr` file or tldraw\.com URL to SVG, PNG, and other formats.
65
65
  | ------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
66
66
  | `<files-or-urls..>` | The tldraw sketch to export. May be one or more paths to local `.tldr` files, or tldraw.com sketch URLs. Accepts a mix of both file paths and URLs, and supports glob matching via your shell. Prints the absolute path(s) to the exported image(s) to `stdout`. |
67
67
 
68
- | Option | Alias | Description Value | Default Value |
69
- | ------------------- | ----- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------- |
70
- | `--format [string]` | `-f` | Output image format, one of `svg`, `png`, `json`, or `tldr`. | `svg` |
71
- | `--output <string>` | `-o` | Output image directory. | `./` |
72
- | `--name <string>` | `-n` | Output image name (without extension). By default the original file name or URL id is used. | |
73
- | `--frames [array]` | | Export each sketch "frame" as a separate image. Pass one or more frame names or IDs to export specific frames, or skip the arguments to export all frames. | `false` |
74
- | `--transparent ` | `-t` | Export an image with a transparent background. | `false` |
75
- | `--dark-mode ` | `-d` | Export a dark theme version of the image. | `false` |
76
- | `--strip-style` | | Remove `<style>` elements from SVG output, useful to lighten the load of embedded fonts if you intend to provide your own stylesheets. Applies to SVG output only. | `false` |
77
- | `--print` | `-p` | Print the exported image(s) to stdout instead of saving to a file. Incompatible with `--output`, and overrides `--name`. PNGs are printed as base64-encoded strings. | `false` |
78
- | `--verbose` | | Enable verbose logging. All verbose logs and prefixed with their log level and are printed to `stderr` for ease of redirection. | `false` |
68
+ | Option | Alias | Description | Default Value |
69
+ | ------------------- | ----- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------- |
70
+ | `--format [string]` | `-f` | Output image format, one of `svg`, `png`, `json`, or `tldr`. | `svg` |
71
+ | `--output <string>` | `-o` | Output image directory. | `./` |
72
+ | `--name <string>` | `-n` | Output image name (without extension). By default the original file name or URL id is used. | |
73
+ | `--frames [array]` | | Export each sketch "frame" as a separate image. Pass one or more frame names or IDs to export specific frames, or skip the arguments to export all frames. | `false` |
74
+ | `--transparent ` | `-t` | Export an image with a transparent background. | `false` |
75
+ | `--dark ` | `-d` | Export a dark theme version of the image. | `false` |
76
+ | `--strip-style` | | Remove `<style>` elements from SVG output, useful to lighten the load of embedded fonts if you intend to provide your own stylesheets. Applies to SVG output only. | `false` |
77
+ | `--print` | `-p` | Print the exported image(s) to stdout instead of saving to a file. Incompatible with `--output`, and ignores `--name`. PNGs are printed as base64-encoded strings. | `false` |
78
+ | `--verbose` | | Enable verbose logging. All verbose logs and prefixed with their log level and are printed to `stderr` for ease of redirection. | `false` |
79
79
 
80
80
  #### Command: Open
81
81
 
@@ -83,7 +83,7 @@ Export a tldraw `.tldr` file or tldraw\.com URL to SVG, PNG, and other formats.
83
83
  tldraw-cli open [files-or-urls..]
84
84
  ```
85
85
 
86
- Open a tldraw `.tldr` file or tldraw\.com URL your default browser. Uses a locally-hosted instance of tldraw. Call `open` without an argument to open a blank sketch. Sketches opened via URL are temporarily copied to the local system, and will not be kept in sync with tldraw.com.
86
+ Open a tldraw `.tldr` file or tldraw\.com URL your default browser. Uses a locally-hosted instance of tldraw. Call `open` without an argument to open a blank sketch. Sketches opened via URL are temporarily copied to the local system, and will not be kept in sync with tldraw.com. This command does not exit until the browser is closed.
87
87
 
88
88
  _"Save as" support is not yet implemented in the local tldraw instance, so the `open` command is only recommended for viewing purposes at the moment._
89
89
 
@@ -123,7 +123,7 @@ tldraw-cli export https://www.tldraw.com/s/v2_c_JsxJk8dag6QsrqExukis4 --format t
123
123
 
124
124
  This is approximately equivalent to clicking the tldraw\.com "☰ → File → Save a copy" menu item.
125
125
 
126
- Note that using `--format tldr` with a _file path_ instead of a _URL_ will still send the file through the pipeline, but it's effectively a no-op. (Except perhaps rare edge cases where tldraw performs a file format version migration).
126
+ Note that using `--format tldr` with a _file path_ instead of a _URL_ will still send the file through the pipeline, but it's effectively a no-op. (Except perhaps in rare edge cases where tldraw performs a file format version migration).
127
127
 
128
128
  ### Export to a specific image / file format
129
129
 
@@ -219,18 +219,17 @@ The library exports a single async function, `tldrawToImage`, which takes an opt
219
219
  async function tldrawToImage(
220
220
  tldrPathOrUrl: string,
221
221
  {
222
- darkMode?: boolean
222
+ dark?: boolean
223
223
  format?: 'svg' | 'png' | 'json' | 'tldr'
224
224
  frames?: boolean | string[]
225
225
  name?: string
226
226
  output?: string
227
227
  stripStyle?: boolean
228
228
  transparent?: boolean
229
- verbose?: boolean
230
229
  }): Promise<string[]>;
231
230
  ```
232
231
 
233
- The function exports the image in the requested format returns an array of the output image(s) or file(s).
232
+ The function exports the image in the requested format and returns an array of the output image(s) or file(s).
234
233
 
235
234
  Generally, a single file is returned — but the `string[]` return type also accommodates invocations with `frame: true` where multiple images will be generated.
236
235
 
@@ -269,6 +268,22 @@ await tldrawToImage('https://www.tldraw.com/s/v2_c_FI5RYWbdpAtjsy4OIKrKw', {
269
268
  })
270
269
  ```
271
270
 
271
+ By default, the Node API only logs warnings and errors. If you want to log the equivalent of the `--verbose` flag from the command line version, then you can set a flag on a logging object exported from the library:
272
+
273
+ ```ts
274
+ // tldraw-cli-api-verbose-test.ts
275
+
276
+ import { tldrawToImage, log } from '@kitschpatrol/tldraw-cli'
277
+
278
+ // this will log extra info
279
+ log.verbose = true
280
+ await tldrawToImage('https://www.tldraw.com/s/v2_c_JsxJk8dag6QsrqExukis4')
281
+
282
+ // now we'll only log errors and warnings
283
+ log.verbose = false
284
+ await tldrawToImage('https://www.tldraw.com/s/v2_c_JsxJk8dag6QsrqExukis4')
285
+ ```
286
+
272
287
  _Note that the library provided is ESM-only, and requires a Node-compatible runtime. TypeScript type definitions are included._
273
288
 
274
289
  ## Background
@@ -291,7 +306,7 @@ On Discord:
291
306
 
292
307
  This tool is not a part of the official tldraw project, and it is currently only tested and known to be compatible with tldraw 2.0.0-beta.2.\_
293
308
 
294
- Due to the current implementation of tldraw, export depends on functionality provided by a web browser. So, behind the scenes, this app serves a local instance of tldraw, then loads a `.tldr` and invokes the export download via [Puppeteer](https://pptr.dev).
309
+ Due to the current implementation of tldraw, export depends on functionality provided by a web browser. So, behind the scenes, this app serves a local instance of tldraw, then loads a `.tldr` and invokes the export download via the [Puppeteer](https://pptr.dev) headless browser automation tool.
295
310
 
296
311
  This can be a bit slow, (exporting seems to take a second or two), but in the context of a statically-generated content pipeline it's not the end of the world.
297
312
 
@@ -304,7 +319,7 @@ The local instance of tldraw includes its assets dependencies, so the tool shoul
304
319
  This is a very minimal implementation. Current plans for future improvements include the following:
305
320
 
306
321
  - Add save button to local tldraw
307
- - Accept globs and optimize batch processing with a single puppeteer instance
322
+ - Accept globs and optimize batch processing with a single Puppeteer instance
308
323
  - Add CLI tests
309
324
  - Implement the ability to export specific pages as separate image files
310
325
  - Add an option flag to set dpi when exporting to a bitmap format
package/dist/tldraw/assets/index-S3CdIkLU.css DELETED
@@ -1 +0,0 @@
1
- .tl-container{font-size:12px;--space-1: 2px;--space-2: 4px;--space-3: 8px;--space-4: 12px;--space-5: 16px;--space-6: 20px;--space-7: 28px;--space-8: 32px;--space-9: 64px;--space-10: 72px;--radius-0: 2px;--radius-1: 4px;--radius-2: 6px;--radius-3: 9px;--radius-4: 11px;--layer-background: 100;--layer-grid: 150;--layer-canvas: 200;--layer-shapes: 300;--layer-overlays: 400;--layer-following-indicator: 1000;--tl-zoom: 1;--tl-cursor-none: none;--tl-cursor-default: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z' fill='white'/><path d='m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z' fill='white'/><path d='m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z' fill='black'/><path d='m13 10.814v11.188l2.969-2.866.428-.139h4.768z' fill='black'/></g></svg>") 12 8, default;--tl-cursor-pointer: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m13.3315 21.3799c-.284-.359-.629-1.093-1.243-1.984-.348-.504-1.211-1.453-1.468-1.935-.223-.426-.199-.617-.146-.97.094-.628.738-1.117 1.425-1.051.519.049.959.392 1.355.716.239.195.533.574.71.788.163.196.203.277.377.509.23.307.302.459.214.121-.071-.496-.187-1.343-.355-2.092-.128-.568-.159-.657-.281-1.093-.129-.464-.195-.789-.316-1.281-.084-.348-.235-1.059-.276-1.459-.057-.547-.087-1.439.264-1.849.275-.321.906-.418 1.297-.22.512.259.803 1.003.936 1.3.239.534.387 1.151.516 1.961.164 1.031.466 2.462.476 2.763.024-.369-.068-1.146-.004-1.5.058-.321.328-.694.666-.795.286-.085.621-.116.916-.055.313.064.643.288.766.499.362.624.369 1.899.384 1.831.086-.376.071-1.229.284-1.584.14-.234.497-.445.687-.479.294-.052.655-.068.964-.008.249.049.586.345.677.487.218.344.342 1.317.379 1.658.015.141.074-.392.293-.736.406-.639 1.843-.763 1.898.639.025.654.02.624.02 1.064 0 .517-.012.828-.04 1.202-.031.4-.117 1.304-.242 1.742-.086.301-.371.978-.652 1.384 0 0-1.074 1.25-1.191 1.813-.118.562-.079.566-.102.965-.023.398.121.922.121.922s-.802.104-1.234.035c-.391-.063-.875-.841-1-1.079-.172-.328-.539-.265-.682-.023-.225.383-.709 1.07-1.051 1.113-.668.084-2.054.031-3.139.02 0 0 .185-1.011-.227-1.358-.305-.259-.83-.784-1.144-1.06z' fill='white'/><g stroke='black' stroke-linecap='round' stroke-width='.75'><path d='m13.3315 21.3799c-.284-.359-.629-1.093-1.243-1.984-.348-.504-1.211-1.453-1.468-1.935-.223-.426-.199-.617-.146-.97.094-.628.738-1.117 1.425-1.051.519.049.959.392 1.355.716.239.195.533.574.71.788.163.196.203.277.377.509.23.307.302.459.214.121-.071-.496-.187-1.343-.355-2.092-.128-.568-.159-.657-.281-1.093-.129-.464-.195-.789-.316-1.281-.084-.348-.235-1.059-.276-1.459-.057-.547-.087-1.439.264-1.849.275-.321.906-.418 1.297-.22.512.259.803 1.003.936 1.3.239.534.387 1.151.516 1.961.164 1.031.466 2.462.476 2.763.024-.369-.068-1.146-.004-1.5.058-.321.328-.694.666-.795.286-.085.621-.116.916-.055.313.064.643.288.766.499.362.624.369 1.899.384 1.831.086-.376.071-1.229.284-1.584.14-.234.497-.445.687-.479.294-.052.655-.068.964-.008.249.049.586.345.677.487.218.344.342 1.317.379 1.658.015.141.074-.392.293-.736.406-.639 1.843-.763 1.898.639.025.654.02.624.02 1.064 0 .517-.012.828-.04 1.202-.031.4-.117 1.304-.242 1.742-.086.301-.371.978-.652 1.384 0 0-1.074 1.25-1.191 1.813-.118.562-.079.566-.102.965-.023.398.121.922.121.922s-.802.104-1.234.035c-.391-.063-.875-.841-1-1.079-.172-.328-.539-.265-.682-.023-.225.383-.709 1.07-1.051 1.113-.668.084-2.054.031-3.139.02 0 0 .185-1.011-.227-1.358-.305-.259-.83-.784-1.144-1.06z' stroke-linejoin='round'/><path d='m21.5664 21.7344v-3.459'/><path d='m19.5508 21.7461-.016-3.473'/><path d='m17.5547 18.3047.021 3.426'/></g></g></svg>") 14 10, pointer;--tl-cursor-cross: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m25 16h-6.01v-6h-2.98v6h-6.01v3h6.01v6h2.98v-6h6.01z' fill='white'/><path d='m23.9902 17.0103h-6v-6.01h-.98v6.01h-6v.98h6v6.01h.98v-6.01h6z' fill='%23231f1f'/></g></svg>") 16 16, crosshair;--tl-cursor-move: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m19 14h1v1h-1zm1 6h-1v-1h1zm-5-5h-1v-1h1zm0 5h-1v-1h1zm2-10.987-7.985 7.988 5.222 5.221 2.763 2.763 7.984-7.985z' fill='white'/><g fill='black'><path d='m23.5664 16.9971-2.557-2.809v1.829h-4.009-4.001v-1.829l-2.571 2.809 2.572 2.808-.001-1.808h4.001 4.009l-.001 1.808z'/><path d='m17.9873 17h.013v-4.001l1.807.001-2.807-2.571-2.809 2.57h1.809v4.001h.008v4.002l-1.828-.001 2.807 2.577 2.805-2.576h-1.805z'/></g></g></svg>") 16 16, move;--tl-cursor-grab: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m13.5557 17.5742c-.098-.375-.196-.847-.406-1.552-.167-.557-.342-.859-.47-1.233-.155-.455-.303-.721-.496-1.181-.139-.329-.364-1.048-.457-1.44-.119-.509.033-.924.244-1.206.253-.339.962-.49 1.357-.351.371.13.744.512.916.788.288.46.357.632.717 1.542.393.992.564 1.918.611 2.231l.085.452c-.001-.04-.043-1.122-.044-1.162-.035-1.029-.06-1.823-.038-2.939.002-.126.064-.587.084-.715.078-.5.305-.8.673-.979.412-.201.926-.215 1.401-.017.423.173.626.55.687 1.022.014.109.094.987.093 1.107-.013 1.025.006 1.641.015 2.174.004.231.003 1.625.017 1.469.061-.656.094-3.189.344-3.942.144-.433.405-.746.794-.929.431-.203 1.113-.07 1.404.243.285.305.446.692.482 1.153.032.405-.019.897-.02 1.245 0 .867-.021 1.324-.037 2.121-.001.038-.015.298.023.182.094-.28.188-.542.266-.745.049-.125.241-.614.359-.859.114-.234.211-.369.415-.688.2-.313.415-.448.668-.561.54-.235 1.109.112 1.301.591.086.215.009.713-.028 1.105-.061.647-.254 1.306-.352 1.648-.128.447-.274 1.235-.34 1.601-.072.394-.234 1.382-.359 1.82-.086.301-.371.978-.652 1.384 0 0-1.074 1.25-1.192 1.812-.117.563-.078.567-.101.965-.024.399.121.923.121.923s-.802.104-1.234.034c-.391-.062-.875-.841-1-1.078-.172-.328-.539-.265-.682-.023-.225.383-.709 1.07-1.051 1.113-.668.084-2.054.03-3.139.02 0 0 .185-1.011-.227-1.358-.305-.26-.83-.784-1.144-1.06l-.832-.921c-.284-.36-.629-1.093-1.243-1.985-.348-.504-1.027-1.085-1.284-1.579-.223-.425-.331-.954-.19-1.325.225-.594.675-.897 1.362-.832.519.05.848.206 1.238.537.225.19.573.534.75.748.163.195.203.276.377.509.23.307.302.459.214.121' fill='white'/><g stroke='black' stroke-linecap='round' stroke-width='.75'><path d='m13.5557 17.5742c-.098-.375-.196-.847-.406-1.552-.167-.557-.342-.859-.47-1.233-.155-.455-.303-.721-.496-1.181-.139-.329-.364-1.048-.457-1.44-.119-.509.033-.924.244-1.206.253-.339.962-.49 1.357-.351.371.13.744.512.916.788.288.46.357.632.717 1.542.393.992.564 1.918.611 2.231l.085.452c-.001-.04-.043-1.122-.044-1.162-.035-1.029-.06-1.823-.038-2.939.002-.126.064-.587.084-.715.078-.5.305-.8.673-.979.412-.201.926-.215 1.401-.017.423.173.626.55.687 1.022.014.109.094.987.093 1.107-.013 1.025.006 1.641.015 2.174.004.231.003 1.625.017 1.469.061-.656.094-3.189.344-3.942.144-.433.405-.746.794-.929.431-.203 1.113-.07 1.404.243.285.305.446.692.482 1.153.032.405-.019.897-.02 1.245 0 .867-.021 1.324-.037 2.121-.001.038-.015.298.023.182.094-.28.188-.542.266-.745.049-.125.241-.614.359-.859.114-.234.211-.369.415-.688.2-.313.415-.448.668-.561.54-.235 1.109.112 1.301.591.086.215.009.713-.028 1.105-.061.647-.254 1.306-.352 1.648-.128.447-.274 1.235-.34 1.601-.072.394-.234 1.382-.359 1.82-.086.301-.371.978-.652 1.384 0 0-1.074 1.25-1.192 1.812-.117.563-.078.567-.101.965-.024.399.121.923.121.923s-.802.104-1.234.034c-.391-.062-.875-.841-1-1.078-.172-.328-.539-.265-.682-.023-.225.383-.709 1.07-1.051 1.113-.668.084-2.054.03-3.139.02 0 0 .185-1.011-.227-1.358-.305-.26-.83-.784-1.144-1.06l-.832-.921c-.284-.36-.629-1.093-1.243-1.985-.348-.504-1.027-1.085-1.284-1.579-.223-.425-.331-.954-.19-1.325.225-.594.675-.897 1.362-.832.519.05.848.206 1.238.537.225.19.573.534.75.748.163.195.203.276.377.509.23.307.302.459.214.121' stroke-linejoin='round'/><path d='m20.5664 21.7344v-3.459'/><path d='m18.5508 21.7461-.016-3.473'/><path d='m16.5547 18.3047.021 3.426'/></g></g></svg>") 16 16, grab;--tl-cursor-grabbing: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m13.5732 12.0361c.48-.178 1.427-.069 1.677.473.213.462.396 1.241.406 1.075.024-.369-.024-1.167.137-1.584.117-.304.347-.59.686-.691.285-.086.62-.116.916-.055.313.064.642.287.765.499.362.623.368 1.899.385 1.831.064-.272.07-1.229.283-1.584.141-.235.497-.445.687-.479.294-.052.656-.068.964-.008.249.049.586.344.677.487.219.344.342 1.316.379 1.658.016.141.074-.393.293-.736.406-.639 1.844-.763 1.898.639.026.654.02.624.02 1.064 0 .516-.012.828-.04 1.202-.03.399-.116 1.304-.241 1.742-.086.301-.371.978-.653 1.384 0 0-1.074 1.25-1.191 1.812-.117.563-.078.567-.102.965-.023.399.121.923.121.923s-.801.104-1.234.034c-.391-.062-.875-.84-1-1.078-.172-.328-.539-.265-.682-.023-.224.383-.709 1.07-1.05 1.113-.669.084-2.055.03-3.14.02 0 0 .185-1.011-.227-1.358-.305-.26-.83-.784-1.144-1.06l-.832-.921c-.283-.36-1.002-.929-1.243-1.985-.213-.936-.192-1.395.037-1.77.232-.381.67-.589.854-.625.208-.042.692-.039.875.062.223.123.313.159.488.391.23.307.312.456.213.121-.076-.262-.322-.595-.434-.97-.109-.361-.401-.943-.38-1.526.008-.221.103-.771.832-1.042' fill='white'/><g stroke='black' stroke-width='.75'><path d='m13.5732 12.0361c.48-.178 1.427-.069 1.677.473.213.462.396 1.241.406 1.075.024-.369-.024-1.167.137-1.584.117-.304.347-.59.686-.691.285-.086.62-.116.916-.055.313.064.642.287.765.499.362.623.368 1.899.385 1.831.064-.272.07-1.229.283-1.584.141-.235.497-.445.687-.479.294-.052.656-.068.964-.008.249.049.586.344.677.487.219.344.342 1.316.379 1.658.016.141.074-.393.293-.736.406-.639 1.844-.763 1.898.639.026.654.02.624.02 1.064 0 .516-.012.828-.04 1.202-.03.399-.116 1.304-.241 1.742-.086.301-.371.978-.653 1.384 0 0-1.074 1.25-1.191 1.812-.117.563-.078.567-.102.965-.023.399.121.923.121.923s-.801.104-1.234.034c-.391-.062-.875-.84-1-1.078-.172-.328-.539-.265-.682-.023-.224.383-.709 1.07-1.05 1.113-.669.084-2.055.03-3.14.02 0 0 .185-1.011-.227-1.358-.305-.26-.83-.784-1.144-1.06l-.832-.921c-.283-.36-1.002-.929-1.243-1.985-.213-.936-.192-1.395.037-1.77.232-.381.67-.589.854-.625.208-.042.692-.039.875.062.223.123.313.159.488.391.23.307.312.456.213.121-.076-.262-.322-.595-.434-.97-.109-.361-.401-.943-.38-1.526.008-.221.103-.771.832-1.042z' stroke-linejoin='round'/><path d='m20.5664 19.7344v-3.459' stroke-linecap='round'/><path d='m18.5508 19.7461-.016-3.473' stroke-linecap='round'/><path d='m16.5547 16.3047.021 3.426' stroke-linecap='round'/></g></g></svg>") 16 16, grabbing;--tl-cursor-text: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path fill='white' d='M7.94 0a5.25 5.25 0 0 0-3.47 1.17A5.27 5.27 0 0 0 1 0H0v3h1c1.41 0 1.85.7 2 1v3.94H2v3h1v3c-.13.3-.57 1-2 1H0v3h1a5.27 5.27 0 0 0 3.47-1.17c.98.8 2.21 1.21 3.47 1.17h1v-3h-1c-1.41 0-1.85-.7-2-1v-3H7v-3H6V4c.13-.3.57-1 2-1h1V0H7.94z'/><path fill='black' d='M7.94 2V1a4 4 0 0 0-3.47 1.64A4 4 0 0 0 1 1v1c1.3-.17 2.56.6 3 1.84v5.1H3v1h1v4.16c-.45 1.24-1.7 2-3 1.84v1a4.05 4.05 0 0 0 3.47-1.63 4.05 4.05 0 0 0 3.47 1.63v-1A2.82 2.82 0 0 1 5 14.1V9.93h1v-1H5V3.85A2.81 2.81 0 0 1 7.94 2z'/></g></svg>") 4 10, text;--tl-cursor-zoom-in: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m20.5 15c0 3.038-2.462 5.5-5.5 5.5s-5.5-2.462-5.5-5.5 2.462-5.5 5.5-5.5 5.5 2.462 5.5 5.5' fill='white'/><path d='m20.5 15c0 3.038-2.462 5.5-5.5 5.5s-5.5-2.462-5.5-5.5 2.462-5.5 5.5-5.5 5.5 2.462 5.5 5.5z' stroke='black'/><g fill='black'><path d='m18 14h-2v-2h-2v2h-2v1.98h2v2.02h2v-2.02h2z'/><path d='m23.5859 25 1.414-1.414-5.449-5.449-1.414 1.414z'/></g></g></svg>") 16 16, zoom-in;--tl-cursor-zoom-out: url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m20.5 15c0 3.038-2.462 5.5-5.5 5.5s-5.5-2.462-5.5-5.5 2.462-5.5 5.5-5.5 5.5 2.462 5.5 5.5' fill='white'/><path d='m20.5 15c0 3.038-2.462 5.5-5.5 5.5s-5.5-2.462-5.5-5.5 2.462-5.5 5.5-5.5 5.5 2.462 5.5 5.5z' stroke='black'/><g fill='black'><path d='m18 16h-5.98v-1.98h5.98z'/><path d='m23.5859 25 1.414-1.414-5.449-5.449-1.414 1.414z'/></g></g></svg>") 16 16, zoom-out;--tl-cursor: var(--tl-cursor-default);--tl-cursor-resize-edge: ew-resize;--tl-cursor-resize-corner: nesw-resize;--tl-cursor-ew-resize: ew-resize;--tl-cursor-ns-resize: ns-resize;--tl-cursor-nesw-resize: nesw-resize;--tl-cursor-nwse-resize: nwse-resize;--tl-cursor-rotate: pointer;--tl-cursor-nwse-rotate: pointer;--tl-cursor-nesw-rotate: pointer;--tl-cursor-senw-rotate: pointer;--tl-cursor-swne-rotate: pointer;--tl-scale: calc(1 / var(--tl-zoom));--tl-font-draw: "tldraw_draw", sans-serif;--tl-font-sans: "tldraw_sans", sans-serif;--tl-font-serif: "tldraw_serif", serif;--tl-font-mono: "tldraw_mono", monospace;--a: calc(min(.5, 1 / var(--tl-zoom))*2px) ;--b: calc(min(.5, 1 / var(--tl-zoom))*-2px) ;--tl-text-outline: 0 var(--b) 0 var(--color-background), 0 var(--a) 0 var(--color-background), var(--b) var(--b) 0 var(--color-background), var(--a) var(--b) 0 var(--color-background), var(--a) var(--a) 0 var(--color-background), var(--b) var(--a) 0 var(--color-background);position:relative;top:0;left:0;width:100%;height:100%;overflow:clip}.tl-theme__light{--color-accent: hsl(0, 76%, 60%);--color-background: hsl(210, 20%, 98%);--color-brush-fill: hsl(0, 0%, 56%, 10.2%);--color-brush-stroke: hsl(0, 0%, 56%, 25.1%);--color-grid: hsl(0, 0%, 43%);--color-low: hsl(204, 16%, 94%);--color-low-border: hsl(204, 16%, 92%);--color-culled: hsl(204, 14%, 93%);--color-muted-none: hsl(0, 0%, 0%, 0%);--color-muted-0: hsl(0, 0%, 0%, 2%);--color-muted-1: hsl(0, 0%, 0%, 10%);--color-muted-2: hsl(0, 0%, 0%, 4.3%);--color-hint: hsl(0, 0%, 0%, 5.5%);--color-overlay: hsl(0, 0%, 0%, 20%);--color-divider: hsl(0, 0%, 91%);--color-panel-contrast: hsl(0, 0%, 100%);--color-panel-overlay: hsl(0, 0%, 100%, 82%);--color-panel: hsl(0, 0%, 99%);--color-focus: hsl(214, 100%, 29%);--color-selected: hsl(214, 84%, 56%);--color-selected-contrast: hsl(0, 0%, 100%);--color-selection-fill: hsl(210, 100%, 56%, 24%);--color-selection-stroke: hsl(214, 84%, 56%);--color-text-0: hsl(0, 0%, 11%);--color-text-1: hsl(0, 0%, 18%);--color-text-3: hsl(220, 2%, 65%);--color-text-shadow: hsl(0, 0%, 100%);--color-primary: hsl(214, 84%, 56%);--color-warn: hsl(0, 90%, 43%);--color-text: hsl(0, 0%, 0%);--color-laser: hsl(0, 100%, 50%);--shadow-1: 0px 1px 2px hsl(0, 0%, 0%, 25%), 0px 1px 3px hsl(0, 0%, 0%, 9%);--shadow-2: 0px 0px 2px hsl(0, 0%, 0%, 16%), 0px 2px 3px hsl(0, 0%, 0%, 24%), 0px 2px 6px hsl(0, 0%, 0%, .1), inset 0px 0px 0px 1px var(--color-panel-contrast);--shadow-3: 0px 1px 2px hsl(0, 0%, 0%, 28%), 0px 2px 6px hsl(0, 0%, 0%, 14%), inset 0px 0px 0px 1px var(--color-panel-contrast);--shadow-4: 0px 0px 3px hsl(0, 0%, 0%, 19%), 0px 5px 4px hsl(0, 0%, 0%, 16%), 0px 2px 16px hsl(0, 0%, 0%, 6%), inset 0px 0px 0px 1px var(--color-panel-contrast)}.tl-theme__dark{--color-accent: hsl(0, 76%, 60%);--color-background: hsl(240, 5%, 8%);--color-brush-fill: hsl(0, 0%, 71%, 5.1%);--color-brush-stroke: hsl(0, 0%, 71%, 25.1%);--color-grid: hsl(0, 0%, 56%);--color-low: hsl(260, 5%, 12.5%);--color-low-border: hsl(207, 10%, 10%);--color-culled: hsl(210, 11%, 19%);--color-muted-none: hsl(0, 0%, 100%, 0%);--color-muted-0: hsl(0, 0%, 100%, 2%);--color-muted-1: hsl(0, 0%, 100%, 10%);--color-muted-2: hsl(0, 0%, 100%, 5%);--color-hint: hsl(0, 0%, 100%, 7%);--color-overlay: hsl(0, 0%, 0%, 50%);--color-divider: hsl(240, 9%, 25%);--color-panel-contrast: hsl(240, 13%, 22%);--color-panel: hsl(220, 8%, 15%);--color-panel-overlay: hsl(210, 11%, 24%, 82%);--color-focus: hsl(217, 76%, 80%);--color-selected: hsl(217, 89%, 61%);--color-selected-contrast: hsl(0, 0%, 100%);--color-selection-fill: hsl(209, 100%, 57%, 20%);--color-selection-stroke: hsl(214, 84%, 56%);--color-text-0: hsl(0, 9%, 94%);--color-text-1: hsl(0, 0%, 85%);--color-text-3: hsl(210, 6%, 45%);--color-text-shadow: hsl(210, 13%, 18%);--color-primary: hsl(214, 84%, 56%);--color-warn: hsl(0, 81%, 66%);--color-text: hsl(210, 17%, 98%);--color-laser: hsl(0, 100%, 50%);--shadow-1: 0px 1px 2px hsl(0, 0%, 0%, 16.1%), 0px 1px 3px hsl(0, 0%, 0%, 22%), inset 0px 0px 0px 1px var(--color-panel-contrast);--shadow-2: 0px 1px 3px hsl(0, 0%, 0%, 66.6%), 0px 2px 6px hsl(0, 0%, 0%, 33%), inset 0px 0px 0px 1px var(--color-panel-contrast);--shadow-3: 0px 1px 3px hsl(0, 0%, 0%, 50%), 0px 2px 12px hsl(0, 0%, 0%, 50%), inset 0px 0px 0px 1px var(--color-panel-contrast)}.tl-counter-scaled{transform:scale(var(--tl-scale));transform-origin:top left;width:calc(100% * var(--tl-zoom));height:calc(100% * var(--tl-zoom))}.tl-container,.tl-container *{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;scrollbar-highlight-color:transparent;-webkit-user-select:none;user-select:none;box-sizing:border-box;outline:none}.tl-container a{-webkit-touch-callout:initial}.tl-container:focus-within{outline:1px solid var(--color-low)}input,*[contenteditable],*[contenteditable] *{-webkit-user-select:text}.tl-canvas{position:absolute;top:0;left:0;width:100%;height:100%;color:var(--color-text);z-index:var(--layer-canvas);cursor:var(--tl-cursor);overflow:clip;content-visibility:auto;touch-action:none;contain:strict}.tl-fixed-layer{position:absolute;top:0;left:0;width:100%;height:100%;contain:strict;pointer-events:none}.tl-shapes{position:relative;z-index:var(--layer-shapes)}.tl-overlays{position:relative;z-index:var(--layer-overlays)}.tl-overlays__item{position:absolute;top:0;left:0;overflow:visible;pointer-events:none;transform-origin:top left}.tl-svg-context{position:absolute;top:0;left:0;pointer-events:none}.tl-positioned{position:absolute;top:0;left:0;transform-origin:top left}.tl-background{position:absolute;background-color:var(--color-background);top:0;right:0;bottom:0;left:0;z-index:var(--layer-background)}.tl-grid{position:absolute;top:0;left:0;width:100%;height:100%;touch-action:none;pointer-events:none;z-index:var(--layer-grid);contain:strict}.tl-grid-dot{fill:var(--color-grid)}.tl-html-layer{position:absolute;top:0;left:0;width:1px;height:1px;contain:layout style size}.tl-brush{stroke-width:calc(var(--tl-scale) * 1px);contain:size layout}.tl-brush__default{stroke:var(--color-brush-stroke);fill:var(--color-brush-fill)}.tl-scribble{stroke-linejoin:round;stroke-linecap:round;pointer-events:none;contain:size layout}.tl-shape{position:absolute;pointer-events:none;overflow:visible;transform-origin:top left;contain:size layout}.tl-shape__culled{position:relative;background-color:var(--color-culled)}.tl-svg-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;stroke-linecap:round;stroke-linejoin:round;transform-origin:top left;overflow:visible}.tl-html-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;stroke-linecap:round;stroke-linejoin:round;transform-origin:top left;color:inherit}.tl-collaborator__scribble{z-index:10}.tl-collaborator__brush{z-index:20}.tl-collaborator__shape-indicator{z-index:30}.tl-user-scribble{z-index:40}.tl-user-brush{z-index:50}.tl-user-indicator__selected{z-index:60}.tl-user-indicator__hovered{z-index:70}.tl-user-handles{z-index:80}.tl-user-snapline{z-index:90}.tl-selection__fg{pointer-events:none;z-index:100}.tl-user-indicator__hint{z-index:110;stroke-width:calc(2.5px * var(--tl-scale))}.tl-collaborator__cursor-hint{z-index:120}.tl-collaborator__cursor{z-index:130}.tl-cursor{overflow:visible}.tl-shape-indicator{transform-origin:top left;fill:none;stroke-width:calc(1.5px * var(--tl-scale));contain:size}.tl-selection__bg{position:absolute;top:0;left:0;transform-origin:top left;background-color:transparent;pointer-events:all}.tl-selection__fg__outline{fill:none;pointer-events:none;stroke:var(--color-selection-stroke);stroke-width:calc(1.5px * var(--tl-scale))}.tl-corner-handle{pointer-events:none;stroke:var(--color-selection-stroke);fill:var(--color-background);stroke-width:calc(1.5px * var(--tl-scale))}.tl-text-handle{pointer-events:none;fill:var(--color-selection-stroke)}.tl-corner-crop-handle,.tl-corner-crop-edge-handle{pointer-events:none;fill:none;stroke:var(--color-selection-stroke)}.tl-mobile-rotate__bg{pointer-events:all;cursor:var(--tl-cursor-grab)}.tl-mobile-rotate__fg{pointer-events:none;stroke:var(--color-selection-stroke);fill:var(--color-background);stroke-width:calc(1.5px * var(--tl-scale))}.tl-transparent{fill:transparent;stroke:transparent}.tl-handle{pointer-events:all}.tl-handle__bg{fill:transparent;stroke:transparent;pointer-events:all;cursor:var(--tl-cursor-grabbing)}.tl-handle__fg{fill:var(--color-selected-contrast);stroke:var(--color-selection-stroke);stroke-width:calc(1.5px * var(--tl-scale));pointer-events:none}.tl-handle__create{opacity:0}.tl-handle__create:hover{opacity:1}.tl-handle__bg:active{fill:none}.tl-handle__bg:hover{cursor:var(--tl-cursor-grab);fill:var(--color-selection-fill)}@media (pointer: coarse){.tl-handle__bg:active{fill:var(--color-selection-fill)}.tl-handle__create{opacity:1}}.tl-image,.tl-video{object-fit:cover;background-size:cover;width:100%;height:100%}.tl-image-container,.tl-embed-container{width:100%;height:100%;pointer-events:all;display:flex;justify-content:center;align-items:center}.tl-image__tg{--scale: min(2, var(--tl-scale)) ;position:absolute;top:calc(var(--scale) * 8px);right:calc(var(--scale) * 8px);font-size:10px;transform-origin:top right;background-color:var(--color-background);padding:2px 4px;border-radius:var(--radius-1)}.tl-collaborator-cursor{position:absolute}.tl-nametag{top:16px;left:13px;width:fit-content;height:fit-content;max-width:120px;padding:3px 6px;white-space:nowrap;position:absolute;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-family:var(--font-body);border-radius:var(--radius-2);color:var(--color-selected-contrast)}.tl-nametag-title{top:-2px;left:13px;width:fit-content;height:fit-content;padding:0 6px;max-width:120px;white-space:nowrap;position:absolute;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-family:var(--font-body);text-shadow:var(--tl-text-outline);color:var(--color-selected-contrast)}.tl-nametag-chat{top:16px;left:13px;width:fit-content;height:fit-content;color:var(--color-selected-contrast);white-space:nowrap;position:absolute;padding:3px 6px;font-size:12px;font-family:var(--font-body);opacity:1;border-radius:var(--radius-2)}.tl-cursor-chat{position:absolute;color:var(--color-selected-contrast);white-space:nowrap;padding:3px 6px;font-size:12px;font-family:var(--font-body);pointer-events:none;z-index:var(--layer-cursor);margin-top:16px;margin-left:13px;opacity:1;border:none;-webkit-user-select:text;user-select:text;border-radius:var(--radius-2)}.tl-cursor-chat .tl-cursor-chat__bubble{padding-right:12px}.tl-cursor-chat::selection{background:var(--color-selected);color:var(--color-selected-contrast);text-shadow:none}.tl-cursor-chat-fade{opacity:.0001;transition:opacity 5s ease-in-out}.tl-cursor-chat::placeholder{color:var(--color-selected-contrast);opacity:.7}@keyframes spinner{to{transform:rotate(360deg)}}.tl-text-shape__wrapper{position:relative;font-weight:400;min-width:1px;padding:0;margin:0;border:none;height:100%;font-variant:normal;font-style:normal;pointer-events:all;white-space:pre-wrap;overflow-wrap:break-word;text-shadow:var(--tl-text-outline)}.tl-text-shape__wrapper[data-align=start]{text-align:left}.tl-text-shape__wrapper[data-align=middle]{text-align:center}.tl-text-shape__wrapper[data-align=end]{text-align:right}.tl-text-shape__wrapper[data-font=draw]{font-family:var(--tl-font-draw)}.tl-text-shape__wrapper[data-font=sans]{font-family:var(--tl-font-sans)}.tl-text-shape__wrapper[data-font=serif]{font-family:var(--tl-font-serif)}.tl-text-shape__wrapper[data-font=mono]{font-family:var(--tl-font-mono)}.tl-text-shape__wrapper[data-isediting=true] .tl-text-content{opacity:0}.tl-text{margin:0;padding:0;border:0px;color:inherit;caret-color:var(--color-text);background:none;border-image:none;font-size:inherit;font-family:inherit;font-weight:inherit;line-height:inherit;font-variant:inherit;font-style:inherit;text-align:inherit;letter-spacing:inherit;text-shadow:inherit;outline:none;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;pointer-events:all;text-rendering:auto;text-transform:none;text-indent:0px;display:inline-block;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;column-count:initial!important;writing-mode:horizontal-tb!important;word-spacing:0px}.tl-text-measure{position:absolute;z-index:999999;top:-9999px;right:-9999px;opacity:0;width:max-content;box-sizing:border-box;pointer-events:none;line-break:normal;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;resize:none;border:none;user-select:none;contain:style paint;-webkit-user-select:none}.tl-text-input,.tl-text-content{position:absolute;top:0;left:0;width:100%;height:100%;min-width:1px;min-height:1px;overflow:visible;outline:none}.tl-text-content{pointer-events:none}.tl-text-input{resize:none;user-select:all;-webkit-user-select:text;overflow:hidden;cursor:var(--tl-cursor-text)}.tl-text-input::selection{background:var(--color-selected);color:var(--color-selected-contrast);text-shadow:none}.tl-snap-line,.tl-snap-point{stroke:var(--color-accent);stroke-width:calc(1px * var(--tl-scale));fill:none}.tl-group{stroke:var(--color-text);stroke-width:calc(1px * var(--tl-scale));opacity:.5}.tl-bookmark__container{width:100%;height:100%;position:relative;border:1px solid var(--color-panel-contrast);background-color:var(--color-panel);border-radius:var(--radius-2);display:flex;flex-direction:column;overflow:hidden}.tl-bookmark__image_container{flex:1;overflow:hidden;border-top-left-radius:var(--radius-1);border-top-right-radius:var(--radius-1);width:100%;height:100%;display:flex;justify-content:flex-end;align-items:flex-start}.tl-bookmark__image_container>.tl-hyperlink-button:after{background-color:var(--color-panel)}.tl-bookmark__placeholder{width:100%;height:100%;background-color:var(--color-muted-2);border-bottom:1px solid var(--color-muted-2)}.tl-bookmark__image{width:100%;height:100%;object-fit:cover;object-position:center}.tl-bookmark__copy_container{background-color:var(--color-muted);padding:var(--space-4);pointer-events:all}.tl-bookmark__heading,.tl-bookmark__description,.tl-bookmark__link{margin:0;width:100%;font-family:inherit}.tl-bookmark__heading{font-size:16px;font-weight:700;padding-bottom:var(--space-2);margin:8px 0}.tl-bookmark__description{font-size:12px;padding-bottom:var(--space-4)}.tl-bookmark__link{font-size:14px;pointer-events:all;z-index:999;overflow:hidden;display:block;color:var(--color-text);text-overflow:ellipsis;text-decoration:none;color:var(--color-text-1);cursor:var(--tl-cursor-pointer)}.tl-bookmark__link:hover{color:var(--color-selected)}.tl-hyperlink-button{background:none;margin:0;position:absolute;top:0;right:0;height:44px;width:44px;display:flex;align-items:center;justify-content:center;z-index:200;font-size:12px;font-weight:400;color:var(--color-text-1);padding:13px;cursor:var(--tl-cursor-pointer);border:none;outline:none;pointer-events:all}.tl-hyperlink-button:after{content:"";z-index:-1;position:absolute;right:6px;bottom:6px;display:block;width:calc(100% - 12px);height:calc(100% - 12px);border-radius:var(--radius-1);background-color:var(--color-background);pointer-events:none}.tl-hyperlink-button:hover{color:var(--color-selected)}.tl-hyperlink-button:focus-visible{color:var(--color-selected)}.tl-hyperlink-button__icon{width:18px;height:18px;background-color:currentColor;pointer-events:none}.tl-hyperlink-button__hidden{display:none}.tl-text-label{display:flex;justify-content:center;align-items:center;color:var(--color-text);text-shadow:var(--tl-text-outline);line-height:inherit;position:absolute;top:0;right:0;bottom:0;left:0;z-index:10}.tl-text-label[data-isediting=true] .tl-text-content{opacity:0}.tl-text-label[data-hastext=false][data-isediting=false]>.tl-text-label__inner{width:40px;height:40px}.tl-text-label[data-hastext=true][data-isediting=false] .tl-text-content{pointer-events:all}.tl-text-label__inner{position:relative;width:fit-content;height:fit-content;display:flex;align-items:center;justify-content:center;pointer-events:none;min-height:auto}.tl-text-label__inner>.tl-text{position:relative;top:0;left:0;padding:16px;height:fit-content;width:fit-content;border-radius:var(--radius-1);max-width:100%;z-index:3}.tl-text-label__inner>.tl-text-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:16px;z-index:4}.tl-text-label[data-textwrap=true]>.tl-text-label__inner{max-width:100%}.tl-text-label[data-isediting=true]{background-color:transparent;min-height:auto}.tl-text-label[data-isediting=true] p{opacity:0}.tl-text-label[data-align=start],.tl-text-label[data-align=start-legacy]{text-align:left}.tl-text-label[data-align=middle],.tl-text-label[data-align=middle-legacy]{text-align:center}.tl-text-label[data-align=end],.tl-text-label[data-align=end-legacy]{text-align:right}.tl-arrow-hint{stroke:var(--color-text-1);fill:none;stroke-linecap:round;overflow:visible}.tl-arrow-label[data-font=draw],.tl-text-label[data-font=draw]{font-family:var(--tl-font-draw)}.tl-arrow-label[data-font=sans],.tl-text-label[data-font=sans]{font-family:var(--tl-font-sans)}.tl-arrow-label[data-font=serif],.tl-text-label[data-font=serif]{font-family:var(--tl-font-serif)}.tl-arrow-label[data-font=mono],.tl-text-label[data-font=mono]{font-family:var(--tl-font-mono)}.tl-arrow-label{position:absolute;top:-1px;left:-1px;width:2px;height:2px;padding:0;display:flex;justify-content:center;align-items:center;color:var(--color-text);text-shadow:var(--tl-text-outline)}.tl-arrow-label[data-isediting=true] p{opacity:0}.tl-arrow-label[data-isediting=true]>.tl-arrow-label__inner{background-color:var(--color-background)}.tl-arrow-label__inner{border-radius:var(--radius-1);box-sizing:content-box;position:relative;height:max-content;width:max-content;pointer-events:all;display:flex;justify-content:center;align-items:center}.tl-arrow-label p,.tl-arrow-label textarea{margin:0;padding:0;border:0px;color:inherit;caret-color:var(--color-text);background:none;border-image:none;font-size:inherit;font-family:inherit;font-weight:inherit;line-height:inherit;font-variant:inherit;font-style:inherit;text-align:inherit;letter-spacing:inherit;text-shadow:inherit;outline:none;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;pointer-events:all;text-rendering:auto;text-transform:none;text-indent:0px;display:inline-block;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;column-count:initial!important;writing-mode:horizontal-tb!important;word-spacing:0px}.tl-arrow-label p{position:relative;height:max-content;z-index:2;padding:4px;overflow:visible}.tl-arrow-label textarea{z-index:3;margin:0;padding:4px;height:100%;width:100%;position:absolute;resize:none;border:0px;user-select:all;-webkit-user-select:text;caret-color:var(--color-text);border-image:none;min-width:4px}.tl-note__container{position:relative;width:100%;height:100%;border-radius:var(--radius-2);box-shadow:var(--shadow-1);overflow:hidden;border-color:currentColor;border-style:solid;border-width:1px}.tl-note__container .tl-text-label{text-shadow:none}.tl-note__scrim{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;background-color:var(--color-background);opacity:.28}.tl-loading{background-color:var(--color-background);color:var(--color-text-1);height:100%;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--space-2);font-size:14px;font-weight:500;opacity:0;animation:fade-in .2s ease-in-out forwards;animation-delay:.2s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.tl-frame__body{stroke-width:calc(1px * var(--tl-scale))}.tl-frame__creating{stroke:var(--color-selected);fill:none}.tl-frame-heading{display:flex;align-items:center;position:absolute;transform-origin:0% 100%;overflow:hidden;max-width:100%;min-width:32px;height:auto;font-size:12px;padding-bottom:4px;pointer-events:all}.tl-frame-heading-hit-area{pointer-events:all;transform-origin:0% 100%;display:flex;height:100%;width:100%;align-items:center;border-radius:var(--radius-1);background-color:var(--color-background)}.tl-frame-label{pointer-events:all;overflow:hidden;text-overflow:ellipsis;padding:var(--space-3) var(--space-3);position:relative;font-size:inherit;white-space:pre;border:1px solid transparent}.tl-frame-label__editing{color:transparent;white-space:pre;width:auto;overflow:visible;background-color:var(--color-panel);border-radius:var(--radius-1);border-color:var(--color-selected)}.tl-frame-name-input{position:absolute;border:none;background:none;outline:none;padding:var(--space-3) var(--space-3);top:0;right:0;bottom:0;left:0;font-size:inherit;font-family:inherit;font-weight:inherit;width:100%;color:var(--color-text-1);border-radius:var(--radius-1);user-select:all;-webkit-user-select:text;white-space:pre;cursor:var(--tl-cursor-text)}@media (max-width: 600px){.tl-frame-heading{font-size:16px}}.tl-embed{border:none;border-radius:var(--radius-2)}.tl-shape-error-boundary{width:100%;height:100%;background-color:var(--color-muted-1);border-width:calc(1px * var(--tl-scale));border-color:var(--color-muted-1);border-style:solid;border-radius:calc(var(--radius-1) * var(--tl-scale));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:left;position:relative;pointer-events:all;overflow:hidden;padding:var(--space-2)}.tl-shape-error-boundary:before{transform:scale(var(--tl-scale));content:"Error";font-size:12px;font-family:inherit;color:var(--color-text-0)}.tl-error-boundary{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:var(--space-4);background-color:var(--color-background);color:var(--color-text-1);position:absolute;z-index:600}.tl-error-boundary__overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:500;background-color:var(--color-overlay)}.tl-error-boundary__content *{user-select:all;-webkit-user-select:text;pointer-events:all}.tl-error-boundary__canvas{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1}.tl-error-boundary__canvas:after{content:" ";display:block;position:absolute;top:0;right:0;bottom:0;left:0;z-index:600;pointer-events:all}.tl-error-boundary__content{width:fit-content;height:fit-content;max-width:100%;width:400px;max-height:100%;background-color:var(--color-panel);padding:16px;border-radius:16px;box-shadow:var(--shadow-2);font-size:14px;font-weight:400;display:flex;flex-direction:column;overflow:auto;z-index:600;gap:12px}.tl-error-boundary__content__expanded{width:600px}.tl-error-boundary__content h2{font-size:16px;margin:0;font-weight:500}.tl-error-boundary__content p{line-height:1.5;margin:0}.tl-error-boundary__content pre{background-color:var(--color-muted-2);padding:var(--space-5);border-radius:var(--radius-2);overflow:auto;font-size:12px;max-height:320px}.tl-error-boundary__content button{background:none;border:none;font-family:inherit;font-size:14px;font-weight:500;padding:var(--space-4);border-radius:var(--radius-3);cursor:var(--tl-cursor-pointer);color:inherit;background-color:transparent}.tl-error-boundary__content button:hover{background-color:var(--color-low)}.tl-error-boundary__content a{color:var(--color-text-1);font-weight:500;text-decoration:none}.tl-error-boundary__content a:hover{color:var(--color-text-1)}.tl-error-boundary__content__error{position:relative}.tl-error-boundary__content__error button{position:absolute;top:var(--space-2);right:var(--space-2);font-size:12px;padding:var(--space-2) var(--space-3);background-color:var(--color-panel);border-radius:var(--radius-1)}.tl-error-boundary__content__actions{display:flex;justify-content:space-between;gap:var(--space-4);margin:0 0 0 -4px}.tl-error-boundary__content__actions__group{display:flex;gap:var(--space-4)}.tl-error-boundary__content .tl-error-boundary__reset{color:var(--color-warn)}.tl-error-boundary__content .tl-error-boundary__refresh{background-color:var(--color-primary);color:var(--color-selected-contrast)}.tl-error-boundary__content .tl-error-boundary__refresh:hover{background-color:var(--color-primary);opacity:.9}.tl-hidden{opacity:0;pointer-events:none}.debug__ui-logger{position:absolute;top:62px;left:16px;color:#555;font-size:12px;font-family:monospace}.tl-container{--layer-panels: 300;--layer-menus: 400;--layer-overlays: 500;--layer-toasts: 650;--layer-cursor: 700}.tlui-button{position:relative;height:40px;min-width:40px;padding:0 12px;display:flex;align-items:center;justify-content:center;background-color:transparent;border:transparent;color:currentColor;cursor:pointer;pointer-events:all;font-weight:inherit;font-family:inherit;text-rendering:optimizeLegibility;font-size:12px;gap:0px;color:var(--color-text-1);text-shadow:1px 1px var(--color-text-shadow)}.tlui-button:disabled{color:var(--color-text-3);text-shadow:none}.tlui-button:disabled .tlui-kbd{color:var(--color-text-3)}.tlui-button>*{position:relative;z-index:1}.tlui-button__label{flex-grow:2;text-align:left}.tlui-button:focus-visible:not(:hover){outline:1px solid var(--color-selected);outline-offset:-4px;border-radius:var(--radius-3)}.tlui-button:after{display:block;content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;background-color:transparent;border-radius:var(--radius-2)}.tlui-button[aria-expanded=true]:after{background-color:var(--color-muted-0);opacity:1}@media (hover: hover){.tlui-button:after{background-color:var(--color-muted-2);opacity:0}.tlui-button:not(:disabled):hover:after{opacity:1}}.tlui-button__low{border-radius:var(--radius-3);background-color:var(--color-low)}@media (hover: hover){.tlui-button__low:after{background-color:var(--color-muted-2)}}.tlui-button__primary{color:var(--color-primary)}.tlui-button__danger{color:var(--color-warn);text-shadow:none}@media (hover: hover){.tlui-button__primary:not(:disabled,:focus-visible):hover{color:var(--color-primary)}.tlui-button__danger:not(:disabled,:focus-visible):hover{color:var(--color-warn);text-shadow:none}}.tlui-button__panel{position:relative}.tlui-button__icon{height:40px;width:40px;min-height:40px;min-width:40px;padding:0}.tlui-button__icon-left{margin-right:var(--space-2)}.tlui-button__icon[data-state=hinted]:after{background:var(--color-hint);opacity:1}.tlui-button__icon[data-state=hinted]:not(:disabled,:focus-visible):active:after{background:var(--color-hint);opacity:1}@media (hover: hover){.tlui-button__icon:after{top:4px;right:4px;bottom:4px;left:4px;border-radius:var(--radius-2)}.tlui-button__icon[data-state=hinted]:not(:disabled,:focus-visible):hover:after{background:var(--color-hint)}}.tlui-button__menu{height:40px;min-height:40px;min-width:128px;width:100%;gap:8px;margin:-4px 0}.tlui-button__menu:nth-child(1){margin-top:0}.tlui-button__menu:nth-last-child(1){margin-bottom:0}@media (hover: hover){.tlui-button__menu:after{top:4px;right:4px;bottom:4px;left:4px;border-radius:var(--radius-2)}}.tlui-button__checkbox{padding-left:8px}.tlui-button__checkbox__indicator{width:15px;height:15px}.tlui-toolbar__lock-button{position:absolute;top:4px;right:0;pointer-events:all;height:40px;width:40px;min-width:0px;border-radius:var(--radius-2)}.tlui-toolbar__lock-button:after{top:4px;right:4px;bottom:4px;left:4px}.tlui-button__tool{position:relative;height:48px;width:48px;margin-left:-2px;margin-right:-2px}.tlui-button__tool:nth-of-type(1){margin-left:0}.tlui-button__tool:nth-last-of-type(1){margin-right:0}@media (hover: hover){.tlui-button__tool:after{top:4px;right:4px;bottom:4px;left:4px;border-radius:8px}.tlui-button__tool[data-state=selected]:not(:disabled,:focus-visible):hover{color:var(--color-selected-contrast)}}.tlui-button__tool[data-state=selected]{color:var(--color-selected-contrast)}.tlui-button__tool[data-state=selected]:not(:disabled,:focus-visible):active{color:var(--color-selected-contrast)}.tlui-button__tool[data-state=selected]:not(:disabled):after{background:var(--color-selected);opacity:1}.tlui-button__help{height:32px;width:32px;padding:0;min-width:32px;border-radius:100%;background-color:var(--color-low);border:1px solid var(--color-low-border)}@media (hover: hover){.tlui-button__help:after{background-color:var(--color-muted-2);border-radius:100%;top:4px;right:4px;bottom:4px;left:4px}}.tlui-buttons__horizontal{display:flex;flex-direction:row}.tlui-buttons__horizontal>*{margin-left:-2px;margin-right:-2px}.tlui-buttons__horizontal>*:nth-child(1){margin-left:0}.tlui-buttons__horizontal>*:nth-last-child(1){margin-right:0}.tlui-buttons__grid{display:grid;grid-template-columns:repeat(4,auto);grid-auto-flow:row;overflow:hidden}.tlui-buttons__grid>.tlui-button{margin:-2px}.tlui-buttons__grid>.tlui-button:nth-of-type(4n){margin-right:0}.tlui-buttons__grid>.tlui-button:nth-of-type(4n-3){margin-left:0}.tlui-buttons__grid>.tlui-button:nth-of-type(-n+4){margin-top:0}.tlui-buttons__grid>.tlui-button:nth-last-of-type(-n+4){margin-bottom:0}.tlui-zoom-menu__button__pct{width:60px;min-width:60px;text-align:center}@media (max-width: 640px){.tlui-button__tool{height:48px;width:44px}.tlui-button__tool>.tlui-icon{height:16px;width:16px}.tlui-kbd{visibility:hidden}.tlui-menu__group .tlui-button__icon-left{display:none}}.tlui-layout{position:relative;display:grid;grid-template-columns:1fr;grid-template-rows:minmax(0px,1fr) auto;grid-auto-rows:auto;height:100%;max-height:100%;overflow:clip;pointer-events:none;-webkit-user-select:none;user-select:none;contain:strict;z-index:var(--layer-panels);-webkit-transform:translate3d(0,0,0);--sab: env(safe-area-inset-bottom)}.tlui-layout__top{grid-column:1;grid-row:1;display:flex;min-width:0px;justify-content:space-between}.tlui-layout__top__left{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;width:100%;height:100%;flex:0 1 0}.tlui-layout__top__right{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;height:100%;flex:0 0 auto;min-width:0px}.scrollable,.scrollable *{pointer-events:all;touch-action:auto;overscroll-behavior:none}.tlui-helper-buttons{position:relative;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:min-content;gap:var(--space-3);margin:var(--space-2) var(--space-3);white-space:nowrap;pointer-events:none;z-index:var(--layer-panels)}.tlui-icon{flex-shrink:0;width:18px;height:18px;background-color:currentColor}.tlui-icon__small{width:15px;height:15px}.tlui-slider{position:relative;display:flex;align-items:center;-webkit-user-select:none;user-select:none;touch-action:none}.tlui-slider__container{width:100%;padding:0px var(--space-4)}.tlui-slider__track{position:relative;flex-grow:1;height:44px;cursor:pointer}.tlui-slider__track:after{display:block;position:absolute;top:calc(50% - 2px);content:"";height:3px;width:100%;background-color:var(--color-muted-1);border-radius:14px}.tlui-slider__range{position:absolute;top:calc(50% - 2px);left:0;height:3px;background-color:var(--color-selected);border-radius:14px}.tlui-slider__thumb{all:unset;cursor:grab;display:block;width:18px;height:18px;position:relative;top:-1px;background-color:var(--color-panel);border-radius:999px;box-shadow:inset 0 0 0 2px var(--color-text-1)}.tlui-slider__thumb:active{cursor:grabbing;box-shadow:inset 0 0 0 2px var(--color-text-1),var(--shadow-1)}.tlui-slider__thumb:focus-visible{box-shadow:inset 0 0 0 2px var(--color-focus)}.tlui-kbd{font-family:inherit;font-size:11px;line-height:11px;display:grid;justify-items:center;grid-auto-flow:column;grid-template-columns:auto;grid-auto-columns:minmax(1em,auto);gap:1px;align-self:bottom;color:var(--color-text-1);margin-left:var(--space-4)}.tlui-kbd>span{width:100%;text-align:center;display:inline;margin:0;padding:2px;border-radius:2px}.tlui-kbd:not(:last-child){margin-right:var(--space-2)}.tlui-focus-button{z-index:var(--layer-panels);pointer-events:all}.tlui-popover{position:relative;display:flex;align-content:stretch}.tlui-popover__content{position:relative;max-height:75vh;margin:0;border:none;border-radius:var(--radius-3);background-color:var(--color-panel);box-shadow:var(--shadow-3);z-index:var(--layer-menus);overflow:hidden;overflow-y:auto;touch-action:auto;overscroll-behavior:none;scrollbar-width:none;-ms-overflow-style:none}.tlui-debug-panel{background-color:var(--color-low);width:100%;display:grid;align-items:center;grid-template-columns:1fr auto auto;justify-content:space-between;padding-left:var(--space-4);border-top:1px solid var(--color-background);font-size:12px;color:var(--color-text-1);z-index:var(--layer-panels);pointer-events:all}.tlui-debug-panel__current-state{white-space:nowrap}.tlui-menu-zone{position:relative;z-index:var(--layer-panels);width:fit-content;border-right:2px solid var(--color-background);border-bottom:2px solid var(--color-background);border-bottom-right-radius:var(--radius-4);background-color:var(--color-low)}.tlui-menu-zone *[data-state=open]:after{background:linear-gradient(180deg,rgba(144,144,144,0) 0%,var(--color-muted-2) 100%)}.tlui-style-panel__wrapper{box-shadow:var(--shadow-2);border-radius:var(--radius-3);pointer-events:all;background-color:var(--color-panel);height:fit-content;max-height:100%;margin:8px;touch-action:auto;overscroll-behavior:none;overflow-y:auto;overflow-x:hidden;color:var(--color-text)}.tlui-style-panel{position:relative;z-index:var(--layer-panels);pointer-events:all;width:148px;max-width:148px}.tlui-style-panel::-webkit-scrollbar{display:none}.tlui-style-panel .tlui-button.select{width:100%}.tlui-style-panel__section{display:flex;position:relative;flex-direction:column}.tlui-style-panel__section:nth-of-type(n+2):not(:last-child){border-bottom:1px solid var(--color-divider)}.tlui-style-panel__section:empty{display:none}.tlui-style-panel__section__common:not(:only-child){margin-bottom:7px;border-bottom:1px solid var(--color-divider)}.tlui-style-panel__row{display:flex}.tlui-style-panel__row__extra-button{margin-left:-2px}.tlui-style-panel__double-select-picker{display:flex;grid-template-columns:1fr auto;align-items:center;padding-left:var(--space-4);color:var(--color-text-1);font-size:12px}.tlui-style-panel__double-select-picker-label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;flex-grow:2;max-width:100%}.tlui-style-panel__section *[data-state=open]:after{background:var(--color-muted-0)}.tlui-input{background:none;margin:0;position:relative;z-index:1;height:40px;max-height:40px;display:flex;align-items:center;justify-content:center;font-family:inherit;font-size:12px;font-weight:inherit;color:var(--color-text-1);padding:var(--space-4);padding-left:0;border:none;outline:none;text-overflow:ellipsis;width:100%;user-select:all;text-rendering:optimizeLegibility;-webkit-user-select:auto!important}.tlui-input__wrapper{width:100%;height:44px;display:flex;align-items:center;gap:var(--space-4);color:var(--color-text)}.tlui-input__wrapper>.tlui-icon{flex-shrink:0}@media (max-width: 600px){@supports (-webkit-touch-callout: none){.tlui-input{font-size:16px}}}.tlui-dialog__overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:var(--layer-overlays);background-color:var(--color-overlay);pointer-events:all;animation:fadeIn .12s ease-out;display:grid;place-items:center;overflow-y:auto}.tlui-dialog__content{display:flex;flex-direction:column;position:relative;cursor:default;background-color:var(--color-panel);box-shadow:var(--shadow-3);border-radius:var(--radius-3);font-size:12px;overflow:hidden;min-width:300px;max-width:80vw;max-height:80vh}.tlui-dialog__header{position:relative;display:flex;align-items:center;flex:0;z-index:999;padding-left:var(--space-4);color:var(--color-text);height:44px}.tlui-dialog__header__title{flex:1;font-weight:inherit;font-size:12px;margin:0;color:var(--color-text-1)}.tlui-dialog__header__close{justify-self:flex-end}.tlui-dialog__body{padding:var(--space-4) var(--space-4);flex:0 1;overflow-y:auto;overflow-x:hidden;color:var(--color-text-1);user-select:all;-webkit-user-select:text}.tlui-dialog__footer{position:relative;z-index:999}.tlui-dialog__footer__actions{display:flex;align-items:center;justify-content:flex-end}.tlui-dialog__footer__actions>.tlui-button:nth-last-child(n+2){margin-right:-4px}.tlui-toolbar{grid-column:1 / span 3;grid-row:1;display:flex;align-items:center;justify-content:center;flex-grow:2;padding-bottom:calc(var(--space-3) + var(--sab))}.tlui-toolbar__inner{position:relative;width:fit-content;display:flex;gap:var(--space-3);align-items:flex-end}.tlui-toolbar__left{width:fit-content}.tlui-toolbar__extras{position:relative;z-index:1;width:100%;pointer-events:none;top:6px;height:48px}.tlui-toolbar__extras__controls{display:flex;position:relative;flex-direction:row;z-index:1;background-color:var(--color-low);border-top-left-radius:var(--radius-4);border-top-right-radius:var(--radius-4);border:2px solid var(--color-background);margin-left:8px;margin-right:0;pointer-events:all;width:fit-content}.tlui-toolbar__tools{display:flex;flex-direction:row;background-color:var(--color-low);border-radius:var(--radius-4);z-index:var(--layer-panels);pointer-events:all;position:relative;align-items:center;background:var(--color-panel);box-shadow:var(--shadow-2)}.tlui-toolbar__overflow{width:40px}@media (max-width: 640px){.tlui-toolbar__overflow{width:32px;padding:0}.tlui-toolbar *[data-state=open]:after{background:linear-gradient(0deg,rgba(144,144,144,0) 0%,var(--color-muted-2) 100%)}}.tlui-help-menu{pointer-events:all;position:absolute;bottom:var(--space-2);right:var(--space-2);z-index:var(--layer-panels);border:2px solid var(--color-background);border-radius:100%}.tlui-context-menu__move-to-page__name{max-width:min(300px,35vw);overflow:hidden;text-overflow:ellipsis}.tlui-context-menu__move-to-page__name[data-disabled]{color:var(--color-text-3);pointer-events:none}.tlui-menu{z-index:var(--layer-menus);height:fit-content;width:fit-content;max-height:80vh;border-radius:var(--radius-3);pointer-events:all;touch-action:auto;overflow-y:auto;overscroll-behavior:none;background-color:var(--color-panel);box-shadow:var(--shadow-3)}.tlui-menu::-webkit-scrollbar{display:none}.tlui-menu__arrow{position:relative;top:-1px;fill:var(--color-panel);stroke:var(--color-panel-contrast);stroke-width:1px}.tlui-menu__group[data-size=large]{min-width:initial}.tlui-menu__group[data-size=medium]{min-width:144px}.tlui-menu__group[data-size=small]{min-width:96px}.tlui-menu__group[data-size=tiny]{min-width:0px}.tlui-menu__group+.tlui-menu__group{border-top:1px solid var(--color-divider)}.tlui-menu__submenu__trigger[data-state=open]:not(:hover):after{border-radius:var(--radius-1);background:linear-gradient(90deg,rgba(144,144,144,0) 0%,var(--color-muted-2) 100%)}.tlui-menu__submenu__trigger[data-direction=left][data-state=open]:not(:hover):after{border-radius:var(--radius-1);background:linear-gradient(270deg,rgba(144,144,144,0) 0%,var(--color-muted-2) 100%)}.tlui-actions-menu{max-height:calc(100vh - 150px)}.tlui-toast__viewport{position:absolute;top:0;right:0;bottom:0;left:0;margin:0;display:flex;align-items:flex-end;justify-content:flex-end;flex-direction:column;gap:var(--space-3);pointer-events:none;padding:0px var(--space-3) 64px 0px;z-index:var(--layer-toasts)}.tlui-toast__viewport>*{pointer-events:all}.tlui-toast__icon{padding-top:var(--space-4);padding-left:var(--space-4);color:var(--color-text-1)}.tlui-toast__container{min-width:200px;display:flex;flex-direction:row;background-color:var(--color-panel);box-shadow:var(--shadow-2);border-radius:var(--radius-3);font-size:12px}.tlui-toast__main{flex-grow:2;max-width:280px}.tlui-toast__content{padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3)}.tlui-toast__title{font-weight:700;color:var(--color-text-1)}.tlui-toast__description{color:var(--color-text-1);padding:var(--space-3);margin:0;padding:0}.tlui-toast__icon+.tlui-toast__main>.tlui-toast__actions{padding-left:0}.tlui-toast__actions{display:flex;flex-direction:row;justify-content:flex-start;margin-left:0}.tlui-toast__close{align-self:flex-end;flex-shrink:0}@media (prefers-reduced-motion: no-preference){.tlui-toast__container[data-state=open]{animation:slide-in .2s cubic-bezier(.785,.135,.15,.86)}.tlui-toast__container[data-state=closed]{animation:hide .1s ease-in}.tlui-toast__container[data-swipe=move]{transform:translate(var(--radix-toast-swipe-move-x))}.tlui-toast__container[data-swipe=cancel]{transform:translate(0);transition:transform .2s ease-out}.tlui-toast__container[data-swipe=end]{animation:swipe-out .1s ease-out}}.tlui-layout__bottom{grid-row:2}.tlui-layout__bottom__main{width:100%;position:relative;display:flex;align-items:flex-end;justify-content:center}.tlui-navigation-zone{display:flex;width:min-content;flex-direction:column;z-index:var(--layer-panels);pointer-events:all;position:absolute;left:0;bottom:0}.tlui-navigation-zone:before{content:"";display:block;position:absolute;z-index:-1;top:-2px;right:-2px;bottom:0;left:0;border-radius:0;border-top:2px solid var(--color-background);border-right:2px solid var(--color-background);border-top-right-radius:var(--radius-4);background-color:var(--color-low)}.tlui-navigation-zone__toggle .tlui-icon{opacity:.24}.tlui-navigation-zone__toggle:active .tlui-icon{opacity:1}@media (hover: hover){.tlui-navigation-zone__toggle:hover .tlui-icon{opacity:1}}.tlui-minimap{width:100%;height:96px;min-height:96px;overflow:hidden;padding:var(--space-3);padding-top:0}.tlui-minimap__canvas{position:relative;width:100%;height:100%}@keyframes hide{0%{opacity:1}to{opacity:0}}@keyframes slide-in{0%{transform:translate(calc(100% + var(--space-3)))}to{transform:translate(0)}}@keyframes swipe-out{0%{transform:translate(var(--radix-toast-swipe-end-x))}to{transform:translate(calc(100% + var(--space-3)))}}.tlui-page-menu__wrapper{position:relative;display:flex;flex-direction:column;width:220px;height:fit-content;max-height:50vh}.tlui-page-menu__trigger{width:128px}.tlui-page-menu__trigger>span{flex-grow:2;margin-right:var(--space-4)}.tlui-page-menu__header{display:flex;flex-direction:row;align-items:center;width:100%;height:40px;padding-left:var(--space-4);border-bottom:1px solid var(--color-divider)}.tlui-page-menu__header>.tlui-button:nth-of-type(1){margin-right:-4px}.tlui-page-menu__header__title{color:var(--color-text);font-size:12px;flex-grow:2}.tlui-page-menu__name{flex-grow:2;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tlui-page-menu__list{position:relative;flex-direction:column;max-height:100%;overflow-x:hidden;overflow-y:auto;touch-action:auto}.tlui-page-menu__item{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:0px}.tlui-page-menu__item:nth-of-type(n+2){margin-top:-4px}.tlui-page-menu__item__button{width:100%}.tlui-page-menu__item__button:not(:only-child){flex-grow:2;margin-right:-2px}.tlui-page-menu__item__button>span{display:block;flex-grow:2;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tlui-page-menu__item__button__checkbox{padding-left:35px}.tlui-page-menu__item__button__check{position:absolute;left:0;width:24px;padding-left:10px;display:inline-flex;align-items:center;justify-content:center;color:var(--color-text)}.tlui-page_menu__item__sortable{position:absolute;top:0;left:0;width:100%;height:fit-content;display:flex;flex-direction:row;align-items:center;overflow:hidden;z-index:1}.tlui-page_menu__item__sortable__title{flex:1}.tlui-page_menu__item__sortable__title>.tlui-input__wrapper{height:100%}.tlui-page_menu__item__sortable:focus-within{z-index:10}.tlui-page_menu__item__sortable__handle{touch-action:none;width:32px;min-width:0px;height:40px;cursor:grab;color:var(--color-text-3);flex-shrink:0;margin-right:-9px}.tlui-page_menu__item__sortable__handle:active{cursor:grabbing}.tlui-page-menu__item__input{margin-left:12px;height:100%}.tlui-page_menu__item__submenu{pointer-events:all;flex:0;cursor:pointer;display:none;margin:0 0 0 -2px}.tlui-page_menu__item__submenu[data-isediting=true]{display:block}@media (hover: hover){.tlui-page_menu__item__submenu{opacity:0;display:block}.tlui-page_menu__item__submenu:hover,.tlui-page-menu__item:focus-within>.tlui-page_menu__item__submenu,.tlui-page_menu__item__sortable:focus-within>.tlui-page_menu__item__submenu{opacity:1}}.tlui-edit-link-dialog{display:flex;flex-direction:column;gap:var(--space-4);color:var(--color-text)}.tlui-edit-link-dialog__input{background-color:var(--color-muted-2);flex-grow:2;border-radius:var(--radius-2);padding:0px var(--space-4)}.tlui-embed__spacer{flex-grow:2;min-height:0px;margin-left:calc(-1 * var(--space-4));margin-top:calc(-1 * var(--space-4));pointer-events:none}.tlui-embed-dialog__list{display:flex;flex-direction:column;padding-bottom:var(--space-5)}.tlui-embed-dialog__item__image{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background-size:contain;background-repeat:no-repeat;background-position:center center}.tlui-embed-dialog__enter{display:flex;flex-direction:column;gap:var(--space-4);color:var(--color-text-1)}.tlui-embed-dialog__input{background-color:var(--color-muted-2);flex-grow:2;border-radius:var(--radius-2);padding:0px var(--space-4)}.tlui-embed-dialog__warning{color:var(--color-warn);text-shadow:none}.tlui-embed-dialog__instruction__link{display:flex;gap:var(--space-1);margin-top:var(--space-4)}.tlui-embed-dialog__enter a{color:var(--color-text-1)}.tlui-following-indicator{display:block;position:absolute;top:0;right:0;bottom:0;left:0;border-width:2px;border-style:solid;z-index:var(--layer-following-indicator);pointer-events:none}.tlui-offline-indicator{display:flex;flex-direction:row;gap:var(--space-3);color:var(--color-text);background-color:var(--color-low);border:3px solid var(--color-background);padding:0px var(--space-5);height:42px;align-items:center;justify-content:center;border-radius:99px;opacity:0;animation:fade-in;animation-duration:.12s;animation-delay:2s;animation-fill-mode:forwards}.tlui-shortcuts-dialog__header{border-bottom:1px solid var(--color-divider)}.tlui-shortcuts-dialog__body{position:relative;columns:1;column-gap:var(--space-9);pointer-events:all;touch-action:auto}@media (min-width: 475px){.tlui-shortcuts-dialog__body{columns:2;column-gap:var(--space-9)}}@media (min-width: 960px){.tlui-shortcuts-dialog__body{columns:3;column-gap:var(--space-9)}}.tlui-shortcuts-dialog__group{break-inside:avoid-column;padding-bottom:var(--space-6)}.tlui-shortcuts-dialog__group__title{font-size:inherit;font-weight:inherit;margin:0;color:var(--color-text-3);height:32px;display:flex;align-items:center}.tlui-shortcuts-dialog__group__content{display:flex;flex-direction:column;color:var(--color-text-1)}.tlui-shortcuts-dialog__key-pair{display:flex;gap:var(--space-4);align-items:center;justify-content:space-between;height:32px}.tlui-shortcuts-dialog__key-pair__key{flex:1;font-size:12px}