/**
 * DSH image-gen brand skin for the tldraw surface.
 *
 * Injected AFTER the bundled tldraw styles (tl-css.ts): it only re-declares
 * tldraw's own CSS variables and restyles tldraw's own chrome classes, scoped
 * to our canvas container, so upgrading tldraw never requires edits here. This
 * layer owns the UI chrome (panels, toolbars, hover/active feedback, grid
 * dots); colors painted onto the canvas itself (shape palette, selection
 * handles, marquee) come from the runtime theme patch in tl-brand-theme.ts.
 * Dark chrome keeps stock tldraw colors: the plugin lives in DSH's light shell.
 *
 * Beyond re-tinting, this pass reshapes tldraw's signature chrome so the
 * surface no longer reads as "stock tldraw": the grey corner strips (top-left
 * menu zone, bottom-left navigation) become floating white cards with hairline
 * borders, matching the workbench card language.
 */
export declare const TL_THEME_CSS = "\n/* DSH image-gen skin for the tldraw surface (light chrome only). */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light {\n\t/* Canvas surface: a clearly cool blue-grey board, distinguishable from the\n\t   pure-white floating cards at a glance. Same token feeds the runtime\n\t   theme patch (CANVAS_BG in tl-brand-theme.ts). */\n\t--tl-color-background: #e6ebf5;\n\t--tl-color-grid: rgba(88, 110, 158, 0.5);\n\n\t/* Brand accents: selection outlines, active tool, chips, focus rings. */\n\t--tl-color-selected: #2f64f5;\n\t--tl-color-primary: #2f64f5;\n\t--tl-color-focus: #2f64f5;\n\t--tl-color-selection-stroke: #2f64f5;\n\t--tl-color-selection-fill: rgba(47, 100, 245, 0.14);\n\n\t/* Interaction feedback: hover chips and active-tool highlight are tinted\n\t   brand blue instead of tldraw's neutral grey-black. */\n\t--tl-color-hint: rgba(47, 100, 245, 0.14);\n\t--tl-color-muted-1: rgba(47, 100, 245, 0.14);\n\t--tl-color-muted-2: rgba(47, 100, 245, 0.07);\n\n\t/* Chrome: panels, borders, and text aligned with the workbench tokens. */\n\t--tl-color-panel: #ffffff;\n\t--tl-color-panel-contrast: #ffffff;\n\t--tl-color-low: #ffffff;\n\t--tl-color-low-border: #d9e2f2;\n\t--tl-color-divider: #dfe6f3;\n\t--tl-color-text: #182033;\n\t--tl-color-text-0: #182033;\n\t--tl-color-text-1: #242f44;\n\t--tl-color-text-3: #6b7690;\n\n\t/* Shadows: the workbench's cold blue-grey instead of tldraw's black. */\n\t--tl-shadow-1: 0px 1px 2px rgba(30, 42, 76, 0.24), 0px 1px 3px rgba(30, 42, 76, 0.08);\n\t--tl-shadow-2:\n\t\t0px 0px 2px rgba(30, 42, 76, 0.14), 0px 2px 3px rgba(30, 42, 76, 0.2),\n\t\t0px 2px 6px rgba(30, 42, 76, 0.08), inset 0px 0px 0px 1px var(--tl-color-panel-contrast);\n\t--tl-shadow-3:\n\t\t0px 1px 2px rgba(30, 42, 76, 0.24), 0px 2px 6px rgba(30, 42, 76, 0.12),\n\t\tinset 0px 0px 0px 1px var(--tl-color-panel-contrast);\n\t--tl-shadow-4:\n\t\t0px 0px 3px rgba(30, 42, 76, 0.16), 0px 5px 4px rgba(30, 42, 76, 0.13),\n\t\t0px 2px 16px rgba(30, 42, 76, 0.05), inset 0px 0px 0px 1px var(--tl-color-panel-contrast);\n\n\t/* Noticeably rounder chrome than tldraw's stock 4/6/9/11px. */\n\t--tl-radius-1: 6px;\n\t--tl-radius-2: 10px;\n\t--tl-radius-3: 13px;\n\t--tl-radius-4: 16px;\n}\n\n/* ---------------------------------------------------------------\n * De-tldraw pass: reshape tldraw's signature corner strips and\n * floating chrome into the workbench's card language.\n * ------------------------------------------------------------- */\n\n/* Canvas backdrop: subtle vertical gradient (light at top, a touch deeper at\n   the bottom) for an airy, lit-from-above feel. Painted on the UI background\n   layer ONLY \u2014 --tl-color-background stays a flat color because tldraw reuses\n   it for export backgrounds and edge highlight lines, which must stay clean. */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tl-background {\n\tbackground-image: linear-gradient(180deg, #eef2fa 0%, #e6ebf5 60%, #dfe6f4 100%);\n}\n\n/* Top-left menu strip -> floating white card (Page menu + quick actions). */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-menu-zone {\n\tmargin: 10px;\n\tbackground-color: #ffffff;\n\tborder: 1px solid #d9e2f2;\n\tborder-radius: 12px;\n\tbox-shadow: 0px 1px 2px rgba(30, 42, 76, 0.06), 0px 4px 12px rgba(30, 42, 76, 0.08);\n}\n\n/* Bottom-left navigation strip -> floating white card (zoom, pages, minimap).\n   Offsets detach it from the screen corner; the ::before paints the card. */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-navigation-panel {\n\tleft: 12px;\n\tbottom: 12px;\n}\n.dsh-ig-tl-canvas .tl-container.tl-theme__light[dir='rtl'] .tlui-navigation-panel {\n\tleft: auto;\n\tright: 12px;\n}\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-navigation-panel::before {\n\tinset: -6px -6px -6px -6px;\n\tbackground-color: #ffffff;\n\tborder: 1px solid #d9e2f2;\n\tborder-radius: 12px;\n\tbox-shadow: 0px 1px 2px rgba(30, 42, 76, 0.06), 0px 4px 12px rgba(30, 42, 76, 0.08);\n}\n\n/* Bottom toolbar pill -> bordered card so it matches the other cards. */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-main-toolbar__tools {\n\tborder: 1px solid #d9e2f2;\n}\n\n/* Vertical left rail (Figma-style, set via components.Toolbar): float it off\n   the screen edge like the other cards. Stock offsets (top 90px / bottom\n   140px) already clear the top-left menu card and bottom-left minimap card. */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-main-toolbar--vertical {\n\tleft: 12px;\n\tpadding-left: 0;\n}\n\n/* Compact rail buttons (40px instead of stock 48px) for an app-like density\n   that differs from tldraw's chunky mobile-sized chrome. */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-main-toolbar--vertical .tlui-button__tool {\n\twidth: 40px;\n\theight: 40px;\n}\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-main-toolbar--vertical .tlui-button__tool::after {\n\tinset: 3px;\n\tborder-radius: 9px;\n}\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-main-toolbar--vertical .tlui-main-toolbar__extras {\n\twidth: 40px;\n}\n\n/* Right style panel -> bordered card. */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-style-panel__wrapper {\n\tborder: 1px solid #d9e2f2;\n}\n\n/* Dropdown menus and popovers -> hairline border for definition. */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-menu,\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-popover__content {\n\tborder: 1px solid #d9e2f2;\n}\n\n/* Active menu chips (e.g. style panel selections): brand tint instead of grey. */\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-button[data-isactive='true'] {\n\tcolor: #2f64f5;\n}\n.dsh-ig-tl-canvas .tl-container.tl-theme__light .tlui-button[data-isactive='true']::after {\n\tbackground: rgba(47, 100, 245, 0.14);\n}\n";