@maildeno/editor 0.1.3 → 0.1.4
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.
- package/dist/{RowPreviewRow-CBfAnQ6o.js → RowPreviewRow-D-wmhbhZ.js} +1 -1
- package/dist/editor.css +57 -52
- package/dist/{element-CMhqxYnE.js → element-CWjNN0lY.js} +4 -4
- package/dist/element-scoped-styles.css +57 -52
- package/dist/element.js +1 -1
- package/dist/index.js +3 -3
- package/dist/init.js +1 -1
- package/package.json +1 -1
|
@@ -7228,7 +7228,7 @@ function injectBaseStylesIntoHead() {
|
|
|
7228
7228
|
* emitted as junk CSS.
|
|
7229
7229
|
*/
|
|
7230
7230
|
function extractedScopedCss() {
|
|
7231
|
-
const raw = "\n\n.md-input[data-v-3e558228] {\r\n width: 100%;\r\n padding: 0.325rem 0.625rem;\r\n font-size: 13px;\r\n line-height: 1.25rem;\r\n color: var(--md-text);\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.375rem;\r\n outline: none;\r\n transition: border-color 0.15s, box-shadow 0.15s;\n}\n.md-input[data-v-3e558228]::placeholder { color: var(--md-text-subtle);\n}\n.md-input[data-v-3e558228]:focus {\r\n border-color: var(--md-primary);\n}\n.md-input[data-v-3e558228]:disabled { background: var(--md-surface-hover); color: var(--md-text-subtle); cursor: not-allowed;\n}\n.md-input--invalid[data-v-3e558228] { border-color: var(--md-danger);\n}\n.md-input--invalid[data-v-3e558228]:focus { border-color: var(--md-danger); box-shadow: 0 0 0 1px var(--md-danger);\n}\r\n\r\n/* =========================================================\r\n SELECT ROOT\r\n ========================================================= */\n.md-sel__anchor {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.25rem;\r\n width: 100%;\r\n min-height: 32px;\r\n box-sizing: border-box;\r\n padding: 0 0.375rem 0 0.5rem;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.375rem;\r\n font-size: 13px;\r\n color: var(--md-text);\n}\n.md-sel__anchor:focus-within {\r\n border-color: var(--md-primary);\n}\n.md-sel__anchor--open {\r\n border-color: var(--md-primary);\n}\n.md-sel__anchor--disabled {\r\n background: var(--md-surface-hover);\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n SEARCH INPUT\r\n ========================================================= */\n.md-sel__input {\r\n flex: 1;\r\n min-width: 0;\r\n width: 100%;\r\n box-sizing: border-box;\r\n padding: 0.375rem 0;\r\n border: 0;\r\n outline: none;\r\n background: transparent;\r\n font-family: inherit;\r\n font-size: 13px;\r\n line-height: 1.25rem;\r\n color: var(--md-text);\n}\n.md-sel__input::placeholder {\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n NON-FILTERED TRIGGER\r\n ========================================================= */\n.md-sel__triggerText {\r\n flex: 1;\r\n min-width: 0;\r\n box-sizing: border-box;\r\n padding: 0.375rem 0;\r\n border: 0;\r\n outline: none;\r\n background: transparent;\r\n cursor: pointer;\r\n font-family: inherit;\r\n font-size: 13px;\r\n color: var(--md-text);\r\n text-align: left;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\n}\n.md-sel__ph {\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n CHEVRON\r\n ========================================================= */\n.md-sel__chev {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n width: 20px;\r\n height: 20px;\r\n padding: 0;\r\n border: 0;\r\n outline: none;\r\n background: transparent;\r\n cursor: pointer;\r\n color: var(--md-text-muted);\r\n transition:\r\n transform 150ms ease,\r\n color 150ms ease;\n}\n.md-sel__chev--open {\r\n transform: rotate(180deg);\r\n color: var(--md-text);\n}\r\n\r\n/* =========================================================\r\n DROPDOWN\r\n ========================================================= */\n.md-sel__content {\r\n position: relative;\r\n z-index: 999999;\r\n width: var(--reka-combobox-trigger-width);\r\n min-width: 180px;\r\n max-width: 320px;\r\n box-sizing: border-box;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.5rem;\r\n box-shadow:\r\n 0 10px 15px -3px rgb(0 0 0 / 0.12),\r\n 0 4px 6px -4px rgb(0 0 0 / 0.12);\r\n overflow: hidden;\n}\r\n\r\n/* =========================================================\r\n DROPDOWN VIEWPORT\r\n ========================================================= */\n.md-sel__viewport {\r\n width: 100%;\r\n max-height: 240px;\r\n box-sizing: border-box;\r\n overflow-x: hidden;\r\n overflow-y: auto;\r\n padding: 4px;\r\n background: var(--md-surface);\n}\r\n\r\n/* =========================================================\r\n EMPTY\r\n ========================================================= */\n.md-sel__empty {\r\n display: block;\r\n width: 100%;\r\n box-sizing: border-box;\r\n padding: 8px;\r\n background: var(--md-surface);\r\n font-family: inherit;\r\n font-size: 12px;\r\n color: var(--md-text-subtle);\r\n text-align: center;\n}\r\n\r\n/* =========================================================\r\n OPTION\r\n ========================================================= */\n.md-sel__item {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n min-height: 32px;\r\n box-sizing: border-box;\r\n gap: 8px;\r\n padding: 6px 8px;\r\n background: var(--md-surface);\r\n border: 0;\r\n border-radius: 6px;\r\n font-family: inherit;\r\n font-size: 13px;\r\n line-height: 18px;\r\n color: var(--md-text);\r\n cursor: pointer;\r\n outline: none;\r\n user-select: none;\n}\n.md-sel__item:hover {\r\n background: var(--md-surface-muted);\n}\n.md-sel__item[data-highlighted] {\r\n background: var(--md-surface-muted);\n}\n.md-sel__item[data-state=\"checked\"] {\r\n background: var(--md-success-bg);\r\n color: var(--md-success-fg);\r\n font-weight: 500;\n}\n.md-sel__item[data-state=\"checked\"][data-highlighted] {\r\n background: color-mix(in srgb, var(--md-success) 20%, var(--md-success-bg));\n}\r\n\r\n/* =========================================================\r\n OPTION TEXT\r\n ========================================================= */\n.md-sel__itemLabel {\r\n flex: 1;\r\n min-width: 0;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\n}\r\n\r\n/* =========================================================\r\n CHECK\r\n ========================================================= */\n.md-sel__check {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n width: 16px;\r\n height: 16px;\r\n font-size: 12px;\r\n color: currentColor;\n}\r\n\n.section-fade-enter-active[data-v-9ae9089d],\r\n.section-fade-leave-active[data-v-9ae9089d] {\r\n transition: opacity 0.15s ease, transform 0.15s ease;\n}\n.section-fade-enter-from[data-v-9ae9089d],\r\n.section-fade-leave-to[data-v-9ae9089d] {\r\n opacity: 0;\r\n transform: translateY(-3px);\n}\r\n\n.transparent-swatch[data-v-e240a193] {\r\n background-image:\r\n linear-gradient(45deg, #ccc 25%, transparent 25%),\r\n linear-gradient(-45deg, #ccc 25%, transparent 25%),\r\n linear-gradient(45deg, transparent 75%, #ccc 75%),\r\n linear-gradient(-45deg, transparent 75%, #ccc 75%);\r\n background-size: 6px 6px;\r\n background-position: 0 0, 0 3px, 3px -3px, -3px 0;\r\n background-color: white;\n}\r\n\n.transparent-swatch[data-v-936cb96e] {\r\n background-image:\r\n linear-gradient(45deg, #ccc 25%, transparent 25%),\r\n linear-gradient(-45deg, #ccc 25%, transparent 25%),\r\n linear-gradient(45deg, transparent 75%, #ccc 75%),\r\n linear-gradient(-45deg, transparent 75%, #ccc 75%);\r\n background-size: 6px 6px;\r\n background-position: 0 0, 0 3px, 3px -3px, -3px 0;\r\n background-color: white;\n}\r\n\r\n/* =========================================================\r\n FIELD\r\n ========================================================= */\n.md-dp__field {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.0625rem;\r\n width: 100%;\r\n min-height: 32px;\r\n box-sizing: border-box;\r\n padding: 0.375rem 0.375rem 0.375rem 0.5rem;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.375rem;\r\n font-family: inherit;\r\n font-size: 13px;\r\n color: var(--md-text);\n}\n.md-dp__field:focus-within {\r\n border-color: var(--md-primary);\r\n box-shadow: 0 0 0 1px var(--md-primary);\n}\r\n\r\n/* =========================================================\r\n DATE SEGMENTS\r\n ========================================================= */\n.md-dp__seg {\r\n padding: 0 0.0625rem;\r\n border-radius: 0.125rem;\r\n outline: none;\r\n font-family: inherit;\r\n font-size: 13px;\n}\n.md-dp__seg:focus {\r\n background: var(--md-primary);\r\n color: var(--md-surface);\n}\n.md-dp__seg[data-placeholder] {\r\n color: var(--md-text-subtle);\n}\n.md-dp__lit {\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n CALENDAR TRIGGER\r\n ========================================================= */\n.md-dp__trigger {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n margin-left: auto;\r\n width: 20px;\r\n height: 20px;\r\n padding: 0.125rem;\r\n border: 0;\r\n background: transparent;\r\n cursor: pointer;\r\n font-size: 11px;\r\n color: var(--md-text-subtle);\n}\n.md-dp__trigger:hover {\r\n color: var(--md-text-muted);\n}\r\n\r\n/* =========================================================\r\n CALENDAR POPOVER\r\n ========================================================= */\n.md-dp__content {\r\n z-index: 999999;\r\n padding: 0.625rem;\r\n box-sizing: border-box;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.625rem;\r\n box-shadow:\r\n 0 10px 15px -3px rgb(0 0 0 / 0.12),\r\n 0 4px 6px -4px rgb(0 0 0 / 0.12);\n}\r\n\r\n/* =========================================================\r\n CALENDAR\r\n ========================================================= */\n.md-dp__cal {\r\n width: max-content;\n}\r\n\r\n/* =========================================================\r\n HEADER\r\n ========================================================= */\n.md-dp__header {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n margin-bottom: 0.5rem;\n}\n.md-dp__heading {\r\n font-family: inherit;\r\n font-size: 13px;\r\n font-weight: 600;\r\n color: var(--md-text);\n}\r\n\r\n/* =========================================================\r\n PREVIOUS / NEXT\r\n ========================================================= */\n.md-dp__nav {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 24px;\r\n height: 24px;\r\n padding: 0.25rem;\r\n border: 0;\r\n background: transparent;\r\n border-radius: 0.25rem;\r\n cursor: pointer;\r\n font-size: 12px;\r\n color: var(--md-text-muted);\n}\n.md-dp__nav:hover {\r\n background: var(--md-surface-muted);\r\n color: var(--md-text);\n}\n.md-dp__nav:disabled {\r\n opacity: 0.4;\r\n cursor: default;\n}\r\n\r\n/* =========================================================\r\n GRID\r\n ========================================================= */\n.md-dp__grid {\r\n width: 100%;\r\n border-collapse: collapse;\n}\n.md-dp__row {\r\n display: flex;\n}\r\n\r\n/* =========================================================\r\n WEEKDAY HEADER\r\n ========================================================= */\n.md-dp__headCell {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 32px;\r\n height: 28px;\r\n font-family: inherit;\r\n font-size: 11px;\r\n font-weight: 500;\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n DAY BUTTON\r\n ========================================================= */\n.md-dp__day {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 32px;\r\n height: 30px;\r\n padding: 0;\r\n border: 0;\r\n background: transparent;\r\n font-family: inherit;\r\n font-size: 12px;\r\n color: var(--md-text);\r\n border-radius: 0.3125rem;\r\n cursor: pointer;\r\n outline: none;\r\n transition:\r\n background 100ms ease,\r\n color 100ms ease;\n}\n.md-dp__day:hover {\r\n background: var(--md-surface-muted);\n}\n.md-dp__day:focus-visible {\r\n outline: 2px solid var(--md-primary);\r\n outline-offset: -2px;\n}\r\n\r\n/* =========================================================\r\n SELECTED DAY\r\n ========================================================= */\n.md-dp__day[data-selected] {\r\n background: var(--md-primary);\r\n color: var(--md-surface);\r\n font-weight: 600;\n}\n.md-dp__day[data-selected]:hover {\r\n background: var(--md-primary);\n}\r\n\r\n/* =========================================================\r\n TODAY\r\n ========================================================= */\n.md-dp__day[data-today]:not([data-selected]) {\r\n font-weight: 700;\r\n color: var(--md-primary);\n}\r\n\r\n/* =========================================================\r\n OUTSIDE / DISABLED\r\n ========================================================= */\n.md-dp__day[data-outside-view] {\r\n color: var(--md-border-strong);\n}\n.md-dp__day[data-disabled] {\r\n color: var(--md-border-strong);\r\n\r\n cursor: default;\n}\n.md-dp__day[data-disabled]:hover {\r\n background: transparent;\n}\r\n\n.rules-scroll[data-v-ce314c0b] {\r\n overflow-x: auto;\r\n max-width: 100%;\r\n -webkit-overflow-scrolling: touch;\n}\n.rules-scroll[data-v-ce314c0b]::-webkit-scrollbar {\r\n height: 6px;\n}\n.rules-scroll[data-v-ce314c0b]::-webkit-scrollbar-track {\r\n background: var(--md-surface-muted);\r\n border-radius: 4px;\n}\n.rules-scroll[data-v-ce314c0b]::-webkit-scrollbar-thumb {\r\n background: var(--md-border-strong);\r\n border-radius: 4px;\n}\n.rules-scroll[data-v-ce314c0b]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.toggle-btn[data-v-2dd9f5a7] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 28px;\r\n border-radius: 6px;\r\n border: 0.5px solid transparent;\r\n cursor: pointer;\r\n transition:\r\n background 0.1s,\r\n border-color 0.1s,\r\n color 0.1s;\r\n background: transparent;\r\n padding: 0;\r\n outline: none;\n}\n.toggle-btn[data-v-2dd9f5a7]:focus-visible {\r\n box-shadow: 0 0 0 2px var(--md-selection);\n}\n.toggle-btn--idle[data-v-2dd9f5a7] {\r\n border-color: var(--md-border);\r\n color: var(--md-text-subtle);\n}\n.toggle-btn--idle[data-v-2dd9f5a7]:hover {\r\n background: var(--md-surface-hover);\r\n border-color: var(--md-border-strong);\n}\n.toggle-btn--active[data-v-2dd9f5a7] {\r\n background: var(--md-selection-bg);\r\n border-color: var(--md-selection);\r\n color: var(--md-selection-fg);\n}\n.toggle-btn--active[data-v-2dd9f5a7]:hover {\r\n background: color-mix(in srgb, var(--md-selection) 20%, var(--md-selection-bg));\n}\r\n\n.md-btn[data-v-cc741dfc] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 0.375rem;\n padding: 0.5rem 0.875rem;\n font-size: 13px;\n font-weight: 500;\n border-radius: 0.375rem;\n border: 1px solid transparent;\n cursor: pointer;\n transition: background-color 0.15s, border-color 0.15s, opacity 0.15s;\n}\n.md-btn[data-v-cc741dfc]:disabled { opacity: 0.55; cursor: not-allowed;\n}\n.md-btn--primary[data-v-cc741dfc] {\n background: var(--md-button-primary-bg);\n color: var(--md-button-primary-text);\n}\n.md-btn--primary[data-v-cc741dfc]:not(:disabled):hover { background: var(--md-button-primary-hover-bg);\n}\n.md-btn--secondary[data-v-cc741dfc] {\n background: var(--md-button-secondary-bg);\n color: var(--md-button-secondary-text);\n border-color: var(--md-border);\n}\n.md-btn--secondary[data-v-cc741dfc]:not(:disabled):hover { background: var(--md-button-secondary-hover-bg);\n}\n.md-btn--danger[data-v-cc741dfc] { background: var(--md-danger); color: var(--md-on-danger);\n}\n.md-btn--danger[data-v-cc741dfc]:not(:disabled):hover { filter: brightness(0.94);\n}\n.md-btn--success[data-v-cc741dfc] { background: var(--md-success); color: var(--md-surface);\n}\n\n.md-dialog__overlay[data-v-0b61b47b] {\n position: fixed;\n inset: 0;\n z-index: 9998;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n background: rgb(0 0 0 / 0.4);\n}\n.md-dialog[data-v-0b61b47b] {\n width: 420px;\n max-width: 100%;\n max-height: calc(100vh - 2rem);\n display: flex;\n flex-direction: column;\n background: var(--md-surface);\n border-radius: 0.75rem;\n box-shadow: 0 20px 60px rgb(0 0 0 / 0.25);\n outline: none;\n}\n.md-dialog__header[data-v-0b61b47b] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n padding: 1.125rem 1.25rem 0.5rem;\n}\n.md-dialog__header--noTitle[data-v-0b61b47b] { justify-content: flex-end;\n}\n.md-dialog__title[data-v-0b61b47b] { font-size: 17px; font-weight: 600; color: var(--md-text); margin: 0;\n}\n.md-dialog__close[data-v-0b61b47b] {\n display: inline-flex;\n padding: 0.25rem;\n color: var(--md-text-subtle);\n background: none;\n border: 0;\n border-radius: 0.25rem;\n cursor: pointer;\n}\n.md-dialog__close[data-v-0b61b47b]:hover { color: var(--md-text); background: var(--md-surface-muted);\n}\n.md-dialog__body[data-v-0b61b47b] {\n padding: 0.5rem 1.25rem 1.25rem;\n overflow-y: auto;\n font-size: 14px;\n color: var(--md-text);\n}\n.md-dialog__footer[data-v-0b61b47b] {\n display: flex;\n justify-content: flex-end;\n gap: 0.5rem;\n padding: 0 1.25rem 1.25rem;\n}\n.md-dialog__srOnly[data-v-0b61b47b] {\n position: absolute;\n width: 1px; height: 1px;\n padding: 0; margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n}\n\n[data-v-5aa602c3] a {\r\n color: #2563eb;\r\n cursor: pointer;\n}\n[data-v-5aa602c3] a:not([style*=\"text-decoration\"]) {\r\n text-decoration: underline;\n}\n[data-v-5aa602c3] a:hover {\r\n opacity: 0.8;\n}\r\n\r\n/* Merge tag node — inline chip styling.\r\n display:inline ensures the span is exactly as wide as its text content.\r\n No width reservation from hidden raw-tag text since the NodeView\r\n writes only one text node at a time. */\n[data-v-5aa602c3] .merge-tag-node {\r\n display: inline;\r\n white-space: nowrap;\r\n vertical-align: baseline;\r\n cursor: default;\r\n border-radius: 3px;\r\n padding: 0 2px;\n}\r\n\r\n/* List styles — scoped to the editor content area */\n[data-v-5aa602c3] li:not(:last-child) {\r\n margin-bottom: var(--list-item-spacing, 0.25rem);\n}\r\n\r\n/* ─── Toolbar font Select sizing ─────────────────────────────────────────────\r\n Constrain the Select to sit flush inside the toolbar row.\r\n The trigger is kept compact (28px tall) and the overlay is widened so\r\n long font names are readable without being clipped. */\n.toolbar-font-select[data-v-5aa602c3] .p-select {\r\n height: 28px;\r\n min-width: 110px;\r\n max-width: 130px;\r\n border-radius: 6px;\r\n border-color: var(\r\n --md-toolbar-border\r\n ); /* matches other toolbar button borders */\r\n padding: 0 6px;\r\n font-size: 0.75rem;\r\n display: flex;\r\n align-items: center;\n}\n.toolbar-font-select[data-v-5aa602c3] .p-select-label {\r\n padding: 0;\r\n font-size: 0.85rem;\r\n line-height: 1;\n}\n.toolbar-font-select[data-v-5aa602c3] .p-select-dropdown {\r\n width: 20px;\n}\r\n\r\n/* Widen the overlay panel so long font names are not clipped */\n[data-v-5aa602c3] .p-select-overlay {\r\n min-width: 180px !important;\n}\r\n\n.toggle-btn[data-v-916ac99b] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 28px;\r\n border-radius: 6px;\r\n border: 0.5px solid transparent;\r\n cursor: pointer;\r\n transition: background 0.1s, border-color 0.1s, color 0.1s;\r\n background: transparent;\r\n padding: 0;\r\n outline: none;\n}\n.toggle-btn--idle[data-v-916ac99b] {\r\n border-color: color-mix(in srgb, var(--md-border) 80%, transparent);\r\n color: var(--md-text-subtle);\n}\n.toggle-btn--idle[data-v-916ac99b]:hover {\r\n background: var(--md-surface-hover);\r\n border-color: var(--md-border-strong);\r\n color: var(--md-text-muted);\n}\n.toggle-btn--active[data-v-916ac99b] {\r\n background: var(--md-selection-bg);\r\n border-color: var(--md-selection);\r\n color: var(--md-selection-fg);\n}\n.toggle-btn--active[data-v-916ac99b]:hover {\r\n background: color-mix(in srgb, var(--md-selection) 20%, var(--md-selection-bg));\n}\r\n\n.panel[data-v-1ca75986] {\r\n padding: 10px 12px;\r\n background: var(--md-surface);\r\n border: 0.5px solid color-mix(in srgb, var(--md-border) 80%, transparent);\r\n border-radius: 10px;\n}\n.separator[data-v-1ca75986] {\r\n height: 0.5px;\r\n background: color-mix(in srgb, var(--md-border) 80%, transparent);\r\n margin-left: -12px;\r\n margin-right: -12px;\n}\r\n\n.spinner[data-v-3ea84dc7] {\r\n width: 50px;\r\n height: 50px;\r\n border: 5px solid rgba(0, 0, 0, 0.2);\r\n border-top-color: var(--md-selection);\r\n border-radius: 50%;\r\n margin: 0 auto;\r\n animation: spin-3ea84dc7 1s linear infinite;\n}\n@keyframes spin-3ea84dc7 {\nto {\r\n transform: rotate(360deg);\n}\n}\r\n\r\n/* ===== DESIGN SYSTEM TOKENS ===== */\n.desktop-gate[data-v-561a092b] {\r\n --brand-primary: #4a7c59;\r\n --brand-primary-dark: #3a5a40;\r\n --brand-primary-light: #3a5a40;\r\n --brand-gradient-start: #4a7c59;\r\n --brand-gradient-end: #3a5a40;\r\n --gray-50: #f9fafb;\r\n --gray-100: #f3f4f6;\r\n --gray-200: #e5e7eb;\r\n --gray-300: #d1d5db;\r\n --gray-400: #9ca3af;\r\n --gray-500: #6b7280;\r\n --gray-600: #4b5563;\r\n --gray-700: #374151;\r\n --gray-800: #1f2937;\r\n --gray-900: #111827;\r\n --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\r\n --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\r\n --shadow-lg:\r\n 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\r\n --shadow-xl:\r\n 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\r\n --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n}\r\n\r\n/* ===== MAIN LAYOUT ===== */\n.desktop-gate[data-v-561a092b] {\r\n position: fixed;\r\n inset: 0;\r\n z-index: 9999;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n background: linear-gradient(\r\n 135deg,\r\n rgba(255, 255, 255, 0.98) 0%,\r\n rgba(249, 250, 251, 0.98) 100%\r\n );\r\n backdrop-filter: blur(2px);\r\n padding: 1.5rem;\n}\n.gate-container[data-v-561a092b] {\r\n max-width: 520px;\r\n width: 100%;\r\n background: white;\r\n border-radius: 2rem;\r\n padding: 2.5rem;\r\n text-align: center;\r\n box-shadow: var(--shadow-2xl);\r\n animation: fadeInUp-561a092b 0.5s cubic-bezier(0.16, 1, 0.3, 1);\r\n border: 1px solid var(--gray-200);\n}\r\n\r\n/* ===== BRAND BADGE ===== */\n.brand-badge[data-v-561a092b] {\r\n position: relative;\r\n width: 80px;\r\n height: 80px;\r\n margin: 0 auto 1.5rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\n}\n.badge-ring[data-v-561a092b] {\r\n position: absolute;\r\n inset: 0;\r\n border-radius: 50%;\r\n background: linear-gradient(\r\n 135deg,\r\n var(--brand-gradient-start),\r\n var(--brand-gradient-end)\r\n );\r\n animation: pulseRing-561a092b 2s ease-out infinite;\n}\n.badge-icon[data-v-561a092b] {\r\n position: relative;\r\n width: 56px;\r\n height: 56px;\r\n background: white;\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--brand-primary);\r\n box-shadow: var(--shadow-md);\r\n transition: transform 0.2s ease;\n}\n.gate-container:hover .badge-icon[data-v-561a092b] {\r\n transform: scale(1.02);\n}\r\n\r\n/* ===== TYPOGRAPHY ===== */\n.gate-title[data-v-561a092b] {\r\n font-size: 1.875rem;\r\n font-weight: 700;\r\n letter-spacing: -0.02em;\r\n margin: 0 0 1rem 0;\r\n color: var(--gray-900);\n}\n.brand-gradient[data-v-561a092b] {\r\n background: linear-gradient(\r\n 135deg,\r\n var(--brand-gradient-start),\r\n var(--brand-gradient-end)\r\n );\r\n background-clip: text;\r\n -webkit-background-clip: text;\r\n color: transparent;\n}\n.gate-description[data-v-561a092b] {\r\n font-size: 1rem;\r\n line-height: 1.5;\r\n color: var(--gray-600);\r\n margin: 0 0 1.75rem 0;\n}\r\n\r\n/* ===== FEATURE GRID ===== */\n.feature-grid[data-v-561a092b] {\r\n display: flex;\r\n justify-content: center;\r\n gap: 2rem;\r\n margin-bottom: 2rem;\r\n padding: 1rem 0;\r\n border-top: 1px solid var(--gray-200);\r\n border-bottom: 1px solid var(--gray-200);\n}\n.feature-item[data-v-561a092b] {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 0.5rem;\r\n font-size: 0.75rem;\r\n font-weight: 500;\r\n color: var(--gray-700);\n}\n.feature-icon[data-v-561a092b] {\r\n width: 36px;\r\n height: 36px;\r\n background: var(--gray-100);\r\n border-radius: 12px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--brand-primary);\r\n transition: all 0.2s ease;\n}\n.feature-item:hover .feature-icon[data-v-561a092b] {\r\n background: var(--brand-primary);\r\n color: white;\r\n transform: translateY(-2px);\n}\r\n\r\n/* ===== STATUS ===== */\n.detection-status[data-v-561a092b] {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 0.5rem;\r\n padding: 0.5rem 1rem;\r\n background: var(--gray-100);\r\n border-radius: 100px;\r\n font-size: 0.75rem;\r\n font-weight: 500;\r\n color: var(--gray-600);\n}\n.status-dot[data-v-561a092b] {\r\n width: 8px;\r\n height: 8px;\r\n background: #f59e0b;\r\n border-radius: 50%;\r\n animation: pulse-561a092b 1.5s ease-out infinite;\n}\r\n\r\n/* ===== FOOTER ===== */\n.gate-footer[data-v-561a092b] {\r\n margin-top: 2rem;\r\n padding-top: 1.5rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 0.5rem;\r\n font-size: 0.75rem;\r\n color: var(--gray-400);\n}\n.brand-text[data-v-561a092b] {\r\n font-weight: 600;\r\n background: linear-gradient(\r\n 135deg,\r\n var(--brand-gradient-start),\r\n var(--brand-gradient-end)\r\n );\r\n background-clip: text;\r\n -webkit-background-clip: text;\r\n color: transparent;\n}\r\n\r\n/* ===== ANIMATIONS ===== */\n@keyframes fadeInUp-561a092b {\nfrom {\r\n opacity: 0;\r\n transform: translateY(20px);\n}\nto {\r\n opacity: 1;\r\n transform: translateY(0);\n}\n}\n@keyframes pulseRing-561a092b {\n0% {\r\n opacity: 1;\r\n transform: scale(0.95);\n}\n70% {\r\n opacity: 0.4;\r\n transform: scale(1.15);\n}\n100% {\r\n opacity: 0;\r\n transform: scale(1.25);\n}\n}\n@keyframes pulse-561a092b {\n0%,\r\n 100% {\r\n opacity: 1;\n}\n50% {\r\n opacity: 0.4;\n}\n}\r\n\r\n/* ===== RESPONSIVE TOUCH-UPS ===== */\n@media (max-width: 480px) {\n.gate-container[data-v-561a092b] {\r\n padding: 2rem 1.5rem;\n}\n.gate-title[data-v-561a092b] {\r\n font-size: 1.5rem;\n}\n.feature-grid[data-v-561a092b] {\r\n gap: 1.25rem;\n}\n}\r\n\n.row-drop-bar[data-v-601d4b22] {\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n height: 28px;\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n padding: 0 16px;\r\n background: color-mix(in srgb, var(--drop-color) 5%, transparent);\r\n border-radius: 6px;\r\n z-index: 20;\r\n pointer-events: none;\n}\n.row-drop-bar--before[data-v-601d4b22] {\r\n top: -14px;\n}\n.row-drop-bar--after[data-v-601d4b22] {\r\n bottom: -14px;\n}\n.row-drop-bar-line[data-v-601d4b22] {\r\n flex: 1;\r\n height: 2px;\r\n background: color-mix(in srgb, var(--drop-color) 50%, transparent);\r\n border-radius: 2px;\r\n /* animation: bar-expand 0.18s ease forwards; */\n}\r\n\r\n/* @keyframes bar-expand {\r\n from {\r\n transform: scaleX(0);\r\n opacity: 0;\r\n }\r\n to {\r\n transform: scaleX(1);\r\n opacity: 1;\r\n }\r\n} */\n.row-drop-bar-label[data-v-601d4b22] {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\r\n font-size: 11px;\r\n font-weight: 500;\r\n color: var(--drop-color);\r\n white-space: nowrap;\r\n padding: 4px 12px;\r\n background: color-mix(in srgb, var(--drop-color) 10%, transparent);\r\n border: 1px solid color-mix(in srgb, var(--drop-color) 30%, transparent);\r\n border-radius: 24px;\r\n /* animation: label-pop 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; */\n}\r\n\r\n/* @keyframes label-pop {\r\n from {\r\n transform: scale(0.8);\r\n opacity: 0;\r\n }\r\n to {\r\n transform: scale(1);\r\n opacity: 1;\r\n }\r\n} */\n.row-drop-bar-icon[data-v-601d4b22] {\r\n width: 12px;\r\n height: 12px;\r\n flex-shrink: 0;\n}\r\n\r\n/* Transition */\r\n/* .drop-bar-enter-active {\r\n animation: bar-in 0.15s ease forwards;\r\n}\r\n.drop-bar-leave-active {\r\n transition: opacity 0.12s ease;\r\n}\r\n.drop-bar-leave-to {\r\n opacity: 0;\r\n} */\r\n\r\n/* @keyframes bar-in {\r\n from {\r\n opacity: 0;\r\n }\r\n to {\r\n opacity: 1;\r\n }\r\n} */\r\n\n.fade-enter-active[data-v-7f93ba61],\r\n.fade-leave-active[data-v-7f93ba61] {\r\n transition: opacity 0.1s ease;\n}\n.fade-enter-from[data-v-7f93ba61],\r\n.fade-leave-to[data-v-7f93ba61] {\r\n opacity: 0;\n}\r\n\r\n/*\r\n * Stacking fix: CanvasRowDropZone has z-index: 9 and extends its hit-area\r\n * strip into adjacent rows when a layout drag is active. Without an explicit\r\n * stacking context on the column, that strip would catch pointer events for\r\n * the edges of the column — the row drop zone would win and the drop would\r\n * become a top-level row instead of a nested row.\r\n *\r\n * z-index: 1 creates a stacking context ABOVE the drop zone's hit strip.\r\n *\r\n * CRITICAL: When a child component is selected, we must set z-index: auto on\r\n * this column AND on its ancestor CanvasRow (via hasSelectedDescendant).\r\n * z-index: auto removes the column from the stacking context chain entirely,\r\n * letting the selected component's z-50 bubble up to compete at the canvas\r\n * root level — which is what allows the action bar and RichText toolbar to\r\n * paint above sibling rows. If z-index: 1 stays active, ANY z-index on a\r\n * child is capped within this column's own stacking context and can never\r\n * exceed a sibling row painted at z-index: 0 in normal flow.\r\n */\n.canvas-column[data-v-7f93ba61] {\r\n position: relative;\r\n z-index: 1;\n}\n.canvas-column.has-selected-child[data-v-7f93ba61] {\r\n z-index: auto;\n}\r\n\r\n/* ── Base zone ─────────────────────────────────────────────── */\n.canvas-drop-zone[data-v-cc281ed8] {\r\n position: relative;\r\n height: 0;\r\n margin: 0;\r\n z-index: 9;\r\n overflow: visible;\r\n transition: height 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\r\n\r\n/* Full expansion on hover */\n.canvas-drop-zone--active[data-v-cc281ed8] {\r\n height: 52px;\n}\r\n\r\n/* Empty-canvas variant — fills the whole empty area */\n.canvas-drop-zone--empty[data-v-cc281ed8] {\r\n height: 100%;\r\n min-height: 200px;\n}\r\n\r\n/* Full height variant - takes up entire parent container */\n.canvas-drop-zone--full[data-v-cc281ed8] {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n height: auto;\r\n min-height: 100%;\n}\n.canvas-drop-zone--empty .cdz-bar[data-v-cc281ed8] {\r\n inset: 12px;\r\n justify-content: center;\r\n border-radius: 12px;\n}\r\n\r\n/* ── Empty state styles (when fullHeight is true) ── */\n.cdz-empty-state[data-v-cc281ed8] {\r\n position: absolute;\r\n inset: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: none;\r\n background: linear-gradient(\r\n 135deg,\r\n color-mix(in srgb, var(--md-row-selection) 4%, var(--md-surface)) 0%,\r\n color-mix(in srgb, var(--md-row-selection) 8%, var(--md-surface)) 100%\r\n );\r\n border: 2px dashed color-mix(in srgb, var(--md-row-selection) 22%, var(--md-surface));\r\n border-radius: 6px;\r\n transition: all 0.2s ease;\n}\n.canvas-drop-zone--full .cdz-empty-state[data-v-cc281ed8] {\r\n animation: fade-in-cc281ed8 0.3s ease;\n}\n@keyframes fade-in-cc281ed8 {\nfrom {\r\n opacity: 0;\r\n transform: scale(0.98);\n}\nto {\r\n opacity: 1;\r\n transform: scale(1);\n}\n}\n.cdz-empty-content[data-v-cc281ed8] {\r\n text-align: center;\r\n padding: 2rem;\n}\n.cdz-empty-icon[data-v-cc281ed8] {\r\n width: 48px;\r\n height: 48px;\r\n margin: 0 auto 12px;\r\n color: var(--md-text-subtle);\r\n stroke-width: 1.5;\n}\n.cdz-empty-title[data-v-cc281ed8] {\r\n font-size: 1.125rem;\r\n font-weight: 500;\r\n color: var(--md-selection-fg);\r\n margin-bottom: 8px;\r\n letter-spacing: -0.01em;\n}\n.cdz-empty-subtitle[data-v-cc281ed8] {\r\n font-size: 0.875rem;\r\n color: var(--md-text-subtle);\r\n line-height: 1.4;\n}\r\n\r\n/* ── Invisible hit-area ─────────────────────────────────────\r\n * Previously this bled 12px into the rows above and below with pointer-events\r\n * all during a layout drag. That meant dragging a LayoutTab row would hit this\r\n * strip when the cursor was merely near a column's top/bottom edge, and\r\n * insert a top-level row instead of a nested row.\r\n *\r\n * FIX: Shrink the bleed to a small value (−4px) so the strip only covers the\r\n * natural visible gap between rows. Columns retain ownership of their rendered\r\n * area. Combined with CanvasColumn's new z-index: 1 stacking context, the\r\n * column reliably wins for pointer hits inside its body, while the thin gap\r\n * between rows still belongs to this drop zone.\r\n *\r\n * When fully expanded (canvas-drop-zone--active: 52px tall) the zone's own\r\n * height covers the hit area naturally, so bleed here is not needed for the\r\n * \"snap into a big target\" UX — that comes from the zone's own expanded size.\r\n */\n.cdz-hit-area[data-v-cc281ed8] {\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n top: -4px;\r\n bottom: -4px;\r\n z-index: 1;\r\n /* Only catchable during a layout drag; invisible + inert otherwise */\r\n pointer-events: none;\n}\n.canvas-drop-zone--receptive .cdz-hit-area[data-v-cc281ed8] {\r\n pointer-events: all;\n}\r\n\r\n/* Hide empty state when dragging */\n.canvas-drop-zone--full.canvas-drop-zone--receptive .cdz-empty-state[data-v-cc281ed8],\r\n.canvas-drop-zone--full.canvas-drop-zone--active .cdz-empty-state[data-v-cc281ed8] {\r\n opacity: 0.5;\r\n background: color-mix(in srgb, var(--md-row-selection) 4%, transparent);\n}\r\n\r\n/* ── Ghost line (receptive but not hovered) ─────────────────── */\n.cdz-ghost-line[data-v-cc281ed8] {\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n top: 50%;\r\n height: 2px;\r\n transform: translateY(-50%);\r\n background: repeating-linear-gradient(\r\n 90deg,\r\n color-mix(in srgb, var(--md-row-selection) 25%, transparent) 0px,\r\n color-mix(in srgb, var(--md-row-selection) 25%, transparent) 6px,\r\n transparent 6px,\r\n transparent 12px\r\n );\r\n border-radius: 2px;\r\n pointer-events: none;\r\n animation: ghost-pulse-cc281ed8 2s ease-in-out infinite;\n}\n@keyframes ghost-pulse-cc281ed8 {\n0%, 100% { opacity: 0.5;\n}\n50% { opacity: 1;\n}\n}\r\n\r\n/* ── Active bar ─────────────────────────────────────────────── */\n.cdz-bar[data-v-cc281ed8] {\r\n position: absolute;\r\n inset: 4px 0;\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n padding: 0 20px;\r\n background: color-mix(in srgb, var(--md-row-selection) 6%, transparent);\r\n border-radius: 8px;\r\n border: 1.5px dashed color-mix(in srgb, var(--md-row-selection) 35%, transparent);\r\n pointer-events: none; /* let drag events fall through to the parent drop zone */\n}\n.cdz-line[data-v-cc281ed8] {\r\n flex: 1;\r\n height: 2px;\r\n background: linear-gradient(\r\n 90deg,\r\n transparent,\r\n color-mix(in srgb, var(--md-row-selection) 60%, transparent),\r\n color-mix(in srgb, var(--md-row-selection) 80%, transparent),\r\n color-mix(in srgb, var(--md-row-selection) 60%, transparent),\r\n transparent\r\n );\r\n border-radius: 2px;\r\n animation: line-expand-cc281ed8 0.2s ease forwards;\r\n transform-origin: center;\n}\n@keyframes line-expand-cc281ed8 {\nfrom { transform: scaleX(0); opacity: 0;\n}\nto { transform: scaleX(1); opacity: 1;\n}\n}\n.cdz-pill[data-v-cc281ed8] {\r\n display: flex;\r\n align-items: center;\r\n gap: 5px;\r\n font-size: 11px;\r\n font-weight: 600;\r\n color: var(--md-row-selection-fg);\r\n letter-spacing: 0.01em;\r\n white-space: nowrap;\r\n padding: 5px 14px;\r\n background: color-mix(in srgb, var(--md-row-selection) 8%, transparent);\r\n border: 1.5px solid color-mix(in srgb, var(--md-row-selection) 35%, transparent);\r\n border-radius: 100px;\r\n box-shadow: 0 2px 8px color-mix(in srgb, var(--md-row-selection) 15%, transparent);\r\n animation: pill-pop-cc281ed8 0.22s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;\n}\n@keyframes pill-pop-cc281ed8 {\nfrom { transform: scale(0.75); opacity: 0;\n}\nto { transform: scale(1); opacity: 1;\n}\n}\n.cdz-icon[data-v-cc281ed8] {\r\n width: 13px;\r\n height: 13px;\r\n flex-shrink: 0;\n}\r\n\r\n/* ── Transition ─────────────────────────────────────────────── */\n.cdz-bar-enter-active[data-v-cc281ed8] { animation: cdz-in-cc281ed8 0.15s ease forwards;\n}\n.cdz-bar-leave-active[data-v-cc281ed8] { transition: opacity 0.1s ease;\n}\n.cdz-bar-leave-to[data-v-cc281ed8] { opacity: 0;\n}\n@keyframes cdz-in-cc281ed8 {\nfrom { opacity: 0; transform: scaleY(0.6);\n}\nto { opacity: 1; transform: scaleY(1);\n}\n}\r\n\n.drop-line-enter-active[data-v-8ae7a24f] {\r\n transition: opacity 80ms ease, transform 80ms ease;\n}\n.drop-line-leave-active[data-v-8ae7a24f] {\r\n transition: opacity 60ms ease, transform 60ms ease;\n}\n.drop-line-enter-from[data-v-8ae7a24f],\r\n.drop-line-leave-to[data-v-8ae7a24f] {\r\n opacity: 0;\r\n transform: scaleX(0.6);\r\n transform-origin: left center;\n}\r\n\n.slide-enter-active[data-v-ce5a848e],\r\n.slide-leave-active[data-v-ce5a848e] {\r\n transition: all 0.2s ease;\r\n max-height: 500px;\r\n overflow: hidden;\n}\n.slide-enter-from[data-v-ce5a848e],\r\n.slide-leave-to[data-v-ce5a848e] {\r\n opacity: 0;\r\n max-height: 0;\r\n transform: translateY(-10px);\n}\r\n\r\n/* ============================================================\r\n md-dropdown – suggestion list\r\n ============================================================ */\n.md-dropdown[data-v-3cd230e0] {\r\n position: absolute;\r\n top: 100%;\r\n left: 0;\r\n right: 0;\r\n margin-top: 4px;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.375rem;\r\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\r\n z-index: 10;\r\n max-height: 12rem;\r\n overflow-y: auto;\n}\n.md-dropdown-item[data-v-3cd230e0] {\r\n padding: 0.5rem 0.75rem;\r\n cursor: pointer;\r\n color: var(--md-text);\r\n transition: background 0.1s;\n}\n.md-dropdown-item[data-v-3cd230e0]:hover {\r\n background: var(--md-surface-hover);\n}\n.md-dropdown-item--active[data-v-3cd230e0] {\r\n background: var(--md-primary);\r\n color: var(--md-on-primary);\n}\r\n\r\n/* ============================================================\r\n md-tag – selected tag pills\r\n ============================================================ */\n.md-tag[data-v-3cd230e0] {\r\n display: inline-flex;\r\n align-items: center;\r\n padding: 0.125rem 0.75rem; \r\n border-radius: 9999px;\r\n font-size: 0.875rem; \r\n font-weight: 500;\r\n background: var(--md-primary);\r\n color: var(--md-on-primary);\r\n line-height: 1.5;\n}\n.md-tag-remove[data-v-3cd230e0] {\r\n margin-left: 0.5rem;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 1rem;\r\n height: 1rem;\r\n border: none;\r\n background: transparent;\r\n color: color-mix(in srgb, var(--md-on-primary) 80%, transparent);\r\n cursor: pointer;\r\n border-radius: 9999px;\r\n transition:\r\n background 0.15s,\r\n color 0.15s;\r\n padding: 0;\n}\n.md-tag-remove[data-v-3cd230e0]:hover {\r\n background: color-mix(in srgb, var(--md-on-primary) 20%, transparent);\r\n color: var(--md-on-primary);\n}\n.md-tag-remove svg[data-v-3cd230e0] {\r\n width: 100%;\r\n height: 100%;\n}\r\n\r\n/* ============================================================\r\n Scrollbar styling for dropdown (optional, keeps it clean)\r\n ============================================================ */\n.md-dropdown[data-v-3cd230e0]::-webkit-scrollbar {\r\n width: 4px;\n}\n.md-dropdown[data-v-3cd230e0]::-webkit-scrollbar-track {\r\n background: transparent;\n}\n.md-dropdown[data-v-3cd230e0]::-webkit-scrollbar-thumb {\r\n background: var(--md-border);\r\n border-radius: 8px;\n}\n.md-dropdown[data-v-3cd230e0]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.overflow-x-auto[data-v-22183f86] {\r\n max-width: 100%;\r\n -webkit-overflow-scrolling: touch;\n}\n.overflow-x-auto[data-v-22183f86]::-webkit-scrollbar {\r\n height: 6px;\n}\n.overflow-x-auto[data-v-22183f86]::-webkit-scrollbar-track {\r\n background: var(--md-surface-muted);\r\n border-radius: 4px;\n}\n.overflow-x-auto[data-v-22183f86]::-webkit-scrollbar-thumb {\r\n background: var(--md-border-strong);\r\n border-radius: 4px;\n}\n.overflow-x-auto[data-v-22183f86]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.overflow-x-auto[data-v-f8677731] {\r\n max-width: 100%;\r\n -webkit-overflow-scrolling: touch;\n}\n.overflow-x-auto[data-v-f8677731]::-webkit-scrollbar {\r\n height: 6px;\n}\n.overflow-x-auto[data-v-f8677731]::-webkit-scrollbar-track {\r\n background: var(--md-surface-muted);\r\n border-radius: 4px;\n}\n.overflow-x-auto[data-v-f8677731]::-webkit-scrollbar-thumb {\r\n background: var(--md-border-strong);\r\n border-radius: 4px;\n}\n.overflow-x-auto[data-v-f8677731]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.panel-slide-enter-active[data-v-3185c8c2],\r\n.panel-slide-leave-active[data-v-3185c8c2] {\r\n transition:\r\n opacity 0.18s ease,\r\n transform 0.18s ease;\n}\n.panel-slide-enter-from[data-v-3185c8c2],\r\n.panel-slide-leave-to[data-v-3185c8c2] {\r\n opacity: 0;\r\n transform: translateX(-10px);\n}\r\n\r\n/* Filter pill fade */\n.fade-enter-active[data-v-3185c8c2],\r\n.fade-leave-active[data-v-3185c8c2] {\r\n transition:\r\n opacity 0.15s ease,\r\n transform 0.15s ease;\n}\n.fade-enter-from[data-v-3185c8c2],\r\n.fade-leave-to[data-v-3185c8c2] {\r\n opacity: 0;\r\n transform: translateY(-4px);\n}\r\n\r\n/* Smooth row list reorder/filter transitions */\n.row-list-enter-active[data-v-3185c8c2],\r\n.row-list-leave-active[data-v-3185c8c2] {\r\n transition:\r\n opacity 0.2s ease,\r\n transform 0.2s ease;\n}\n.row-list-enter-from[data-v-3185c8c2],\r\n.row-list-leave-to[data-v-3185c8c2] {\r\n opacity: 0;\r\n transform: translateY(6px);\n}\n.row-list-move[data-v-3185c8c2] {\r\n transition: transform 0.2s ease;\n}\r\n\r\n/* Scrollbar — thin, unobtrusive */\n.overflow-y-auto[data-v-3185c8c2]::-webkit-scrollbar {\r\n width: 6px;\n}\n.overflow-y-auto[data-v-3185c8c2]::-webkit-scrollbar-track {\r\n background: transparent;\n}\n.overflow-y-auto[data-v-3185c8c2]::-webkit-scrollbar-thumb {\r\n background: var(--md-border-strong);\r\n border-radius: 9999px;\n}\n.overflow-y-auto[data-v-3185c8c2]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.panel-slide-enter-active[data-v-3ec392a9],\r\n.panel-slide-leave-active[data-v-3ec392a9] {\r\n transition:\r\n opacity 0.18s ease,\r\n transform 0.18s ease;\n}\n.panel-slide-enter-from[data-v-3ec392a9],\r\n.panel-slide-leave-to[data-v-3ec392a9] {\r\n opacity: 0;\r\n transform: translateX(-10px);\n}\n.row-list-enter-active[data-v-3ec392a9],\r\n.row-list-leave-active[data-v-3ec392a9] {\r\n transition:\r\n opacity 0.2s ease,\r\n transform 0.2s ease;\n}\n.row-list-enter-from[data-v-3ec392a9],\r\n.row-list-leave-to[data-v-3ec392a9] {\r\n opacity: 0;\r\n transform: translateY(6px);\n}\n.row-list-move[data-v-3ec392a9] {\r\n transition: transform 0.2s ease;\n}\r\n\r\n/* Scrollbar — thin, unobtrusive. Matches SavedRowsPanel. */\n.overflow-y-auto[data-v-3ec392a9]::-webkit-scrollbar { width: 6px;\n}\n.overflow-y-auto[data-v-3ec392a9]::-webkit-scrollbar-track { background: transparent;\n}\n.overflow-y-auto[data-v-3ec392a9]::-webkit-scrollbar-thumb { background: var(--md-border-strong); border-radius: 9999px;\n}\n.overflow-y-auto[data-v-3ec392a9]::-webkit-scrollbar-thumb:hover { background: var(--md-text-subtle);\n}\r\n\n.md-toast__region[data-v-7583ad77] {\n position: fixed;\n top: 1rem;\n right: 1rem;\n z-index: 9999;\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n pointer-events: none;\n}\n.md-toast[data-v-7583ad77] {\n pointer-events: auto;\n display: flex;\n align-items: flex-start;\n gap: 0.625rem;\n min-width: 280px;\n max-width: 380px;\n padding: 0.75rem 0.875rem;\n font-size: 13px;\n border: 1px solid;\n border-radius: 0.75rem;\n box-shadow: 0 8px 30px rgb(0 0 0 / 0.12);\n}\n.md-toast__icon[data-v-7583ad77] { font-size: 15px; flex-shrink: 0; margin-top: 0.0625rem;\n}\n.md-toast__body[data-v-7583ad77] { flex: 1; min-width: 0;\n}\n.md-toast__summary[data-v-7583ad77] { font-weight: 500;\n}\n.md-toast__detail[data-v-7583ad77] { font-size: 12px; opacity: 0.8; margin-top: 0.125rem;\n}\n.md-toast__close[data-v-7583ad77] { flex-shrink: 0; opacity: 0.5; background: none; border: 0; cursor: pointer; color: inherit;\n}\n.md-toast__close[data-v-7583ad77]:hover { opacity: 1;\n}\n.md-toast--success[data-v-7583ad77] { background: var(--md-success-bg); border-color: var(--md-success-border); color: var(--md-success-fg);\n}\n.md-toast--info[data-v-7583ad77] { background: var(--md-info-bg); border-color: var(--md-info-border); color: var(--md-info-fg);\n}\n.md-toast--warn[data-v-7583ad77] { background: var(--md-surface)beb; border-color: var(--md-warning-border); color: var(--md-warning-fg);\n}\n.md-toast--error[data-v-7583ad77] { background: var(--md-danger-bg); border-color: var(--md-danger-border); color: var(--md-danger-fg);\n}\n.md-toast-enter-active[data-v-7583ad77], .md-toast-leave-active[data-v-7583ad77] { transition: all 0.2s ease;\n}\n.md-toast-enter-from[data-v-7583ad77], .md-toast-leave-to[data-v-7583ad77] { opacity: 0; transform: translateX(20px);\n}\n\n.md-confirm__body[data-v-43b7e283] { display: flex; align-items: flex-start; gap: 0.75rem;\n}\n.md-confirm__icon[data-v-43b7e283] { font-size: 22px; color: var(--md-warning); flex-shrink: 0; margin-top: 0.125rem;\n}\n.md-confirm__message[data-v-43b7e283] { margin: 0; font-size: 14px; line-height: 1.5; color: var(--md-text);\n}\n\r\n/* ── Orb ──────────────────────────────────────────────────────────────────── */\n.health-orb[data-v-0521087e] {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 24px;\r\n height: 24px;\r\n border-radius: 50%;\r\n border: none;\r\n background: transparent;\r\n cursor: pointer;\r\n padding: 0;\r\n outline: none;\r\n flex-shrink: 0;\n}\n.health-orb:focus-visible .orb-core[data-v-0521087e] {\r\n box-shadow: 0 0 0 3px rgba(66, 56, 158, 0.4);\n}\r\n\r\n/* Pulse rings */\n.orb-ring[data-v-0521087e] {\r\n position: absolute;\r\n border-radius: 50%;\r\n animation: orb-pulse-0521087e 2.4s ease-out infinite;\n}\n.orb-ring--outer[data-v-0521087e] {\r\n width: 22px;\r\n height: 22px;\r\n animation-delay: 0s;\n}\n.orb-ring--inner[data-v-0521087e] {\r\n width: 16px;\r\n height: 16px;\r\n animation-delay: 0.6s;\n}\r\n\r\n/* Core */\n.orb-core[data-v-0521087e] {\r\n position: relative;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 50%;\r\n transition: transform 0.15s ease, box-shadow 0.15s ease;\r\n z-index: 1;\n}\n.health-orb:hover .orb-core[data-v-0521087e],\r\n.health-orb--active .orb-core[data-v-0521087e] {\r\n transform: scale(1.15);\n}\r\n\r\n/* ── Status colours with brand accent ───────────────────────────────────────── */\n.health-orb--good .orb-ring[data-v-0521087e] {\r\n background: rgba(34, 197, 94, 0.25);\n}\n.health-orb--good .orb-core[data-v-0521087e] {\r\n background: #22c55e;\r\n box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.2), 0 0 8px rgba(34, 197, 94, 0.4);\n}\n.health-orb--warn .orb-ring[data-v-0521087e] {\r\n background: rgba(245, 158, 11, 0.28);\n}\n.health-orb--warn .orb-core[data-v-0521087e] {\r\n background: #f59e0b;\r\n box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.2), 0 0 8px rgba(245, 158, 11, 0.4);\n}\n.health-orb--bad .orb-ring[data-v-0521087e] {\r\n background: rgba(239, 68, 68, 0.28);\n}\n.health-orb--bad .orb-core[data-v-0521087e] {\r\n background: #ef4444;\r\n box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.2), 0 0 8px rgba(239, 68, 68, 0.4);\n}\n@keyframes orb-pulse-0521087e {\n0% { transform: scale(0.6); opacity: 0.7;\n}\n60% { transform: scale(1.6); opacity: 0;\n}\n100% { transform: scale(1.6); opacity: 0;\n}\n}\r\n\r\n/* ── Panel ────────────────────────────────────────────────────────────────── */\n.health-panel[data-v-0521087e] {\r\n position: absolute;\r\n top: calc(100% + 10px);\r\n left: 50%;\r\n transform: translateX(-50%);\r\n width: 300px;\r\n background: #18181b;\r\n border: 1px solid rgba(255, 255, 255, 0.08);\r\n border-radius: 14px;\r\n padding: 12px;\r\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 4px 12px rgba(0, 0, 0, 0.3);\r\n z-index: 9999;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n /* Smooth horizontal expansion */\r\n transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.health-panel--expanded[data-v-0521087e] {\r\n width: 400px;\n}\r\n\r\n/* When expanded, stat grid uses 3 cols instead of 2 */\n.health-panel--expanded .detail-stats[data-v-0521087e] {\r\n grid-template-columns: repeat(3, 1fr);\n}\r\n\r\n/* When expanded, accessibility list gets more vertical room */\n.health-panel--expanded .a11y-list[data-v-0521087e] {\r\n max-height: 320px;\n}\r\n\r\n/* When expanded, format rows go side-by-side */\n.health-panel--expanded .format-note[data-v-0521087e] {\r\n display: grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 6px;\n}\n.health-panel--expanded .format-row[data-v-0521087e] {\r\n flex-direction: column;\r\n align-items: flex-start;\r\n gap: 4px;\n}\r\n\r\n/* ── Panel header with brand color ─────────────────────────────────────────── */\n.panel-header[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 0 2px 4px;\r\n border-bottom: 1px solid rgba(255, 255, 255, 0.06);\n}\n.panel-header-right[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\n}\r\n\r\n/* Expand toggle button */\n.panel-expand-btn[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 22px;\r\n height: 22px;\r\n border-radius: 6px;\r\n border: 1px solid rgba(255, 255, 255, 0.08);\r\n background: rgba(255, 255, 255, 0.04);\r\n color: rgba(255, 255, 255, 0.35);\r\n cursor: pointer;\r\n transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;\r\n flex-shrink: 0;\r\n padding: 0;\n}\n.panel-expand-btn[data-v-0521087e]:hover {\r\n background: rgba(66, 56, 158, 0.18);\r\n border-color: rgba(66, 56, 158, 0.4);\r\n color: #a5b4fc;\n}\n.panel-expand-btn[data-v-0521087e]:focus-visible {\r\n outline: 2px solid rgba(66, 56, 158, 0.5);\r\n outline-offset: 1px;\n}\n.panel-expand-btn--active[data-v-0521087e] {\r\n background: rgba(66, 56, 158, 0.2);\r\n border-color: rgba(66, 56, 158, 0.45);\r\n color: #a5b4fc;\n}\n.panel-title[data-v-0521087e] {\r\n font-size: 11px;\r\n font-weight: 600;\r\n letter-spacing: 0.06em;\r\n text-transform: uppercase;\r\n color: #a5b4fc;\n}\n.panel-status-badge[data-v-0521087e] {\r\n font-size: 10px;\r\n font-weight: 600;\r\n padding: 2px 8px;\r\n border-radius: 99px;\n}\n.status-badge--good[data-v-0521087e] { background: rgba(34, 197, 94, 0.15); color: #4ade80;\n}\n.status-badge--warn[data-v-0521087e] { background: rgba(245, 158, 11, 0.15); color: #fbbf24;\n}\n.status-badge--bad[data-v-0521087e] { background: rgba(239, 68, 68, 0.15); color: #f87171;\n}\r\n\r\n/* ── Metric cards ─────────────────────────────────────────────────────────── */\n.metric-card[data-v-0521087e] {\r\n border-radius: 10px;\r\n border: 1px solid rgba(255, 255, 255, 0.06);\r\n background: rgba(255, 255, 255, 0.04);\r\n cursor: pointer;\r\n transition: background 0.15s ease, border-color 0.15s ease;\r\n overflow: hidden;\r\n user-select: none;\n}\n.metric-card[data-v-0521087e]:hover {\r\n background: rgba(66, 56, 158, 0.1);\r\n border-color: rgba(66, 56, 158, 0.3);\n}\n.metric-card[data-v-0521087e]:focus-visible {\r\n outline: 2px solid rgba(66, 56, 158, 0.5);\r\n outline-offset: 2px;\n}\n.metric-card--good[data-v-0521087e] { border-color: rgba(34, 197, 94, 0.15);\n}\n.metric-card--warn[data-v-0521087e] { border-color: rgba(245, 158, 11, 0.15);\n}\n.metric-card--bad[data-v-0521087e] { border-color: rgba(239, 68, 68, 0.2);\n}\n.metric-card--good.metric-card--expanded[data-v-0521087e] { background: rgba(34, 197, 94, 0.05);\n}\n.metric-card--warn.metric-card--expanded[data-v-0521087e] { background: rgba(245, 158, 11, 0.05);\n}\n.metric-card--bad.metric-card--expanded[data-v-0521087e] { background: rgba(239, 68, 68, 0.06);\n}\r\n\r\n/* ── Summary row ──────────────────────────────────────────────────────────── */\n.metric-summary[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 9px 10px;\r\n gap: 8px;\n}\n.metric-left[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n gap: 7px;\r\n min-width: 0;\n}\n.metric-icon[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n opacity: 0.8;\r\n flex-shrink: 0;\n}\n.metric-label[data-v-0521087e] {\r\n font-size: 11.5px;\r\n font-weight: 500;\r\n color: rgba(255, 255, 255, 0.7);\r\n white-space: nowrap;\n}\n.metric-right[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\r\n flex-shrink: 0;\n}\r\n\r\n/* Mini bar */\n.mini-bar[data-v-0521087e] {\r\n width: 36px;\r\n height: 4px;\r\n border-radius: 99px;\r\n background: rgba(255, 255, 255, 0.1);\r\n overflow: hidden;\n}\n.mini-bar-fill[data-v-0521087e] {\r\n height: 100%;\r\n border-radius: 99px;\r\n transition: width 0.5s ease;\n}\n.mini-bar-fill--good[data-v-0521087e] { background: #22c55e;\n}\n.mini-bar-fill--warn[data-v-0521087e] { background: #f59e0b;\n}\n.mini-bar-fill--bad[data-v-0521087e] { background: #ef4444;\n}\r\n\r\n/* Status dot */\n.status-dot[data-v-0521087e] {\r\n width: 6px;\r\n height: 6px;\r\n border-radius: 50%;\r\n flex-shrink: 0;\n}\n.status-dot--good[data-v-0521087e] { background: #22c55e;\n}\n.status-dot--warn[data-v-0521087e] { background: #f59e0b;\n}\n.status-dot--bad[data-v-0521087e] { background: #ef4444;\n}\r\n\r\n/* Pulsing dot for bad status */\n.pulse-dot[data-v-0521087e] {\r\n position: relative;\r\n width: 6px;\r\n height: 6px;\r\n flex-shrink: 0;\n}\n.pulse-dot[data-v-0521087e]::before,\r\n.pulse-dot[data-v-0521087e]::after {\r\n content: '';\r\n position: absolute;\r\n inset: 0;\r\n border-radius: 50%;\n}\n.pulse-dot--bad[data-v-0521087e]::before { background: #ef4444; z-index: 1;\n}\n.pulse-dot--bad[data-v-0521087e]::after { background: #ef4444; animation: dot-ping-0521087e 1.5s ease-out infinite;\n}\n@keyframes dot-ping-0521087e {\n0% { transform: scale(1); opacity: 0.75;\n}\n100% { transform: scale(2.5); opacity: 0;\n}\n}\n.metric-value[data-v-0521087e] {\r\n font-size: 11.5px;\r\n font-weight: 600;\r\n font-variant-numeric: tabular-nums;\n}\n.metric-value--good[data-v-0521087e] { color: #4ade80;\n}\n.metric-value--warn[data-v-0521087e] { color: #fbbf24;\n}\n.metric-value--bad[data-v-0521087e] { color: #f87171;\n}\r\n\r\n/* Chevron */\n.chevron[data-v-0521087e] {\r\n color: rgba(255, 255, 255, 0.3);\r\n transition: transform 0.2s ease, color 0.15s ease;\r\n flex-shrink: 0;\n}\n.chevron--open[data-v-0521087e] { transform: rotate(180deg); color: rgba(255, 255, 255, 0.6);\n}\n.metric-card:hover .chevron[data-v-0521087e] { color: rgba(255, 255, 255, 0.5);\n}\r\n\r\n/* ── Expanded detail ──────────────────────────────────────────────────────── */\n.metric-detail[data-v-0521087e] {\r\n padding: 0 10px 10px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n border-top: 1px solid rgba(255, 255, 255, 0.05);\n}\n.detail-tip[data-v-0521087e] {\r\n font-size: 11px;\r\n line-height: 1.55;\r\n color: rgba(255, 255, 255, 0.55);\r\n margin: 6px 0 0;\n}\r\n\r\n/* Stats grid */\n.detail-stats[data-v-0521087e] {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 4px 12px;\n}\n.stat-item[data-v-0521087e] {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: baseline;\r\n gap: 6px;\n}\n.stat-label[data-v-0521087e] {\r\n font-size: 10.5px;\r\n color: rgba(255, 255, 255, 0.35);\r\n white-space: nowrap;\n}\n.stat-value[data-v-0521087e] {\r\n font-size: 11px;\r\n font-weight: 600;\r\n color: rgba(255, 255, 255, 0.75);\r\n font-variant-numeric: tabular-nums;\n}\r\n\r\n/* Thresholds */\n.detail-thresholds[data-v-0521087e] {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 4px;\r\n padding-top: 4px;\r\n border-top: 1px solid rgba(255, 255, 255, 0.05);\n}\n.threshold[data-v-0521087e] {\r\n font-size: 10px;\r\n font-weight: 500;\r\n padding: 2px 7px;\r\n border-radius: 99px;\n}\n.threshold--good[data-v-0521087e] { background: rgba(34, 197, 94, 0.12); color: #4ade80;\n}\n.threshold--warn[data-v-0521087e] { background: rgba(245, 158, 11, 0.12); color: #fbbf24;\n}\n.threshold--bad[data-v-0521087e] { background: rgba(239, 68, 68, 0.12); color: #f87171;\n}\r\n\r\n/* ── Format note (KB card) ────────────────────────────────────────────────── */\n.format-note[data-v-0521087e] {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 5px;\r\n background: rgba(0, 0, 0, 0.2);\r\n border-radius: 8px;\r\n padding: 8px;\n}\n.format-row[data-v-0521087e] {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 8px;\n}\n.format-badge[data-v-0521087e] {\r\n font-size: 9.5px;\r\n font-weight: 700;\r\n letter-spacing: 0.05em;\r\n padding: 2px 6px;\r\n border-radius: 4px;\r\n flex-shrink: 0;\r\n margin-top: 1px;\r\n background: rgba(66, 56, 158, 0.3);\r\n color: #a5b4fc;\n}\n.format-badge--muted[data-v-0521087e] {\r\n background: rgba(255, 255, 255, 0.07);\r\n color: rgba(255, 255, 255, 0.35);\n}\n.format-info[data-v-0521087e] {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 2px;\r\n min-width: 0;\n}\n.format-range[data-v-0521087e] {\r\n font-size: 11px;\r\n font-weight: 600;\r\n color: rgba(255, 255, 255, 0.8);\n}\n.format-range--muted[data-v-0521087e] {\r\n color: rgba(255, 255, 255, 0.35);\r\n font-weight: 500;\n}\n.format-caveat[data-v-0521087e] {\r\n font-size: 10px;\r\n line-height: 1.4;\r\n color: rgba(255, 255, 255, 0.35);\n}\r\n\r\n/* ── Accessibility card ───────────────────────────────────────────────────── */\n.a11y-detail[data-v-0521087e] {\r\n cursor: default;\r\n padding: 8px 10px 10px;\r\n gap: 10px;\n}\r\n\r\n/* Tabs */\n.a11y-tabs[data-v-0521087e] {\r\n display: grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 4px;\r\n background: rgba(0, 0, 0, 0.25);\r\n padding: 3px;\r\n border-radius: 8px;\n}\n.a11y-tab[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 6px;\r\n padding: 6px 4px;\r\n background: transparent;\r\n border: none;\r\n border-radius: 6px;\r\n cursor: pointer;\r\n font-family: inherit;\r\n font-size: 10.5px;\r\n font-weight: 600;\r\n letter-spacing: 0.02em;\r\n color: rgba(255, 255, 255, 0.45);\r\n transition: background 0.15s ease, color 0.15s ease;\n}\n.a11y-tab[data-v-0521087e]:hover {\r\n color: rgba(255, 255, 255, 0.75);\r\n background: rgba(255, 255, 255, 0.04);\n}\n.a11y-tab[data-v-0521087e]:focus-visible {\r\n outline: 2px solid rgba(66, 56, 158, 0.5);\r\n outline-offset: 1px;\n}\n.a11y-tab--active[data-v-0521087e] {\r\n background: rgba(255, 255, 255, 0.07);\r\n color: rgba(255, 255, 255, 0.92);\n}\n.a11y-tab-label[data-v-0521087e] {\r\n text-transform: uppercase;\n}\n.a11y-tab-count[data-v-0521087e] {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n min-width: 18px;\r\n height: 16px;\r\n padding: 0 5px;\r\n border-radius: 99px;\r\n font-size: 10px;\r\n font-weight: 700;\r\n font-variant-numeric: tabular-nums;\r\n line-height: 1;\n}\n.a11y-tab-count--failed[data-v-0521087e] { background: rgba(239, 68, 68, 0.18); color: #f87171;\n}\n.a11y-tab-count--passed[data-v-0521087e] { background: rgba(34, 197, 94, 0.18); color: #4ade80;\n}\n.a11y-tab-count--ignored[data-v-0521087e] { background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.5);\n}\r\n\r\n/* List */\n.a11y-list[data-v-0521087e] {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 6px;\r\n max-height: 240px;\r\n overflow-y: auto;\r\n /* Custom thin scrollbar */\r\n scrollbar-width: thin;\r\n scrollbar-color: rgba(255, 255, 255, 0.12) transparent;\n}\n.a11y-list[data-v-0521087e]::-webkit-scrollbar {\r\n width: 6px;\n}\n.a11y-list[data-v-0521087e]::-webkit-scrollbar-track {\r\n background: transparent;\n}\n.a11y-list[data-v-0521087e]::-webkit-scrollbar-thumb {\r\n background: rgba(255, 255, 255, 0.12);\r\n border-radius: 99px;\n}\n.a11y-empty[data-v-0521087e] {\r\n font-size: 11px;\r\n color: rgba(255, 255, 255, 0.4);\r\n text-align: center;\r\n padding: 12px 4px;\r\n margin: 0;\n}\n.a11y-item[data-v-0521087e] {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n padding: 8px;\r\n border-radius: 8px;\r\n background: rgba(255, 255, 255, 0.03);\r\n border-left: 2px solid transparent;\n}\n.a11y-item--critical[data-v-0521087e] { border-left-color: #ef4444;\n}\n.a11y-item--serious[data-v-0521087e] { border-left-color: #f59e0b;\n}\n.a11y-item--passed[data-v-0521087e] { border-left-color: rgba(34, 197, 94, 0.5);\n}\n.a11y-item--ignored[data-v-0521087e] { border-left-color: rgba(255, 255, 255, 0.18); opacity: 0.75;\n}\n.a11y-item-header[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\n}\n.a11y-severity[data-v-0521087e] {\r\n display: inline-flex;\r\n align-items: center;\r\n font-size: 9px;\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n letter-spacing: 0.05em;\r\n padding: 2px 6px;\r\n border-radius: 4px;\r\n flex-shrink: 0;\n}\n.a11y-severity--critical[data-v-0521087e] { background: rgba(239, 68, 68, 0.18); color: #f87171;\n}\n.a11y-severity--serious[data-v-0521087e] { background: rgba(245, 158, 11, 0.18); color: #fbbf24;\n}\n.a11y-severity--passed[data-v-0521087e] { background: rgba(34, 197, 94, 0.18); color: #4ade80;\n}\n.a11y-severity--ignored[data-v-0521087e] { background: rgba(255, 255, 255, 0.07); color: rgba(255, 255, 255, 0.5);\n}\n.a11y-rule[data-v-0521087e] {\r\n font-size: 11px;\r\n font-weight: 600;\r\n color: rgba(255, 255, 255, 0.85);\r\n flex: 1;\r\n min-width: 0;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\n}\n.a11y-action[data-v-0521087e] {\r\n background: transparent;\r\n border: 1px solid rgba(255, 255, 255, 0.1);\r\n border-radius: 4px;\r\n padding: 2px 7px;\r\n font-family: inherit;\r\n font-size: 9.5px;\r\n font-weight: 600;\r\n color: rgba(255, 255, 255, 0.5);\r\n cursor: pointer;\r\n transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;\r\n flex-shrink: 0;\n}\n.a11y-action[data-v-0521087e]:hover {\r\n background: rgba(255, 255, 255, 0.06);\r\n color: rgba(255, 255, 255, 0.85);\r\n border-color: rgba(255, 255, 255, 0.2);\n}\n.a11y-action[data-v-0521087e]:focus-visible {\r\n outline: 2px solid rgba(66, 56, 158, 0.5);\r\n outline-offset: 1px;\n}\n.a11y-action--restore[data-v-0521087e] {\r\n border-color: rgba(165, 180, 252, 0.25);\r\n color: #a5b4fc;\n}\n.a11y-action--restore[data-v-0521087e]:hover {\r\n background: rgba(66, 56, 158, 0.15);\r\n border-color: rgba(165, 180, 252, 0.4);\r\n color: #c7d2fe;\n}\n.a11y-message[data-v-0521087e] {\r\n font-size: 10.5px;\r\n line-height: 1.5;\r\n color: rgba(255, 255, 255, 0.65);\r\n margin: 0;\n}\n.a11y-info[data-v-0521087e] {\r\n font-size: 10px;\r\n line-height: 1.5;\r\n color: rgba(255, 255, 255, 0.38);\r\n margin: 0;\r\n padding-top: 2px;\r\n border-top: 1px dashed rgba(255, 255, 255, 0.06);\n}\r\n\r\n/* ── Panel footer ─────────────────────────────────────────────────────────── */\n.panel-footer[data-v-0521087e] {\r\n font-size: 10px;\r\n color: rgba(255, 255, 255, 0.22);\r\n text-align: center;\r\n padding-top: 4px;\r\n margin: 0;\n}\r\n\r\n/* ── Click-outside overlay ────────────────────────────────────────────────── */\n.click-outside[data-v-0521087e] {\r\n position: fixed;\r\n inset: 0;\r\n z-index: 9998;\n}\r\n\r\n/* ── Transitions ──────────────────────────────────────────────────────────── */\n.popover-enter-active[data-v-0521087e] {\r\n transition: opacity 0.18s ease, transform 0.18s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n.popover-leave-active[data-v-0521087e] {\r\n transition: opacity 0.12s ease, transform 0.12s ease;\n}\n.popover-enter-from[data-v-0521087e] {\r\n opacity: 0;\r\n transform: translateX(-50%) translateY(-6px) scale(0.97);\n}\n.popover-leave-to[data-v-0521087e] {\r\n opacity: 0;\r\n transform: translateX(-50%) translateY(-4px) scale(0.98);\n}\n.expand-enter-active[data-v-0521087e] {\r\n transition: opacity 0.18s ease, max-height 0.22s ease;\r\n max-height: 300px;\r\n overflow: hidden;\n}\n.expand-leave-active[data-v-0521087e] {\r\n transition: opacity 0.12s ease, max-height 0.18s ease;\r\n overflow: hidden;\n}\n.expand-enter-from[data-v-0521087e] {\r\n opacity: 0;\r\n max-height: 0;\n}\n.expand-leave-to[data-v-0521087e] {\r\n opacity: 0;\r\n max-height: 0;\n}\r\n\n.picker-overlay-enter-active[data-v-5f1ee4c3],\r\n.picker-overlay-leave-active[data-v-5f1ee4c3] {\r\n transition: opacity 0.2s ease;\n}\n.picker-overlay-enter-from[data-v-5f1ee4c3],\r\n.picker-overlay-leave-to[data-v-5f1ee4c3] {\r\n opacity: 0;\n}\n.picker-drawer-enter-active[data-v-5f1ee4c3],\r\n.picker-drawer-leave-active[data-v-5f1ee4c3] {\r\n transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);\n}\n.picker-drawer-enter-from[data-v-5f1ee4c3],\r\n.picker-drawer-leave-to[data-v-5f1ee4c3] {\r\n transform: translateX(100%);\n}\r\n\n.note-enter-active[data-v-b07bbf33],\r\n.note-leave-active[data-v-b07bbf33] {\r\n transition:\r\n opacity 0.2s ease,\r\n max-height 0.25s ease;\r\n max-height: 60px;\r\n overflow: hidden;\n}\n.note-enter-from[data-v-b07bbf33],\r\n.note-leave-to[data-v-b07bbf33] {\r\n opacity: 0;\r\n max-height: 0;\n}\r\n\n.md-msg[data-v-db5ba171] {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n padding: 0.625rem 0.75rem;\n font-size: 13px;\n border: 1px solid;\n border-radius: 0.5rem;\n}\n.md-msg__icon[data-v-db5ba171] { margin-top: 0.125rem; flex-shrink: 0; font-size: 14px;\n}\n.md-msg__body[data-v-db5ba171] { flex: 1; min-width: 0;\n}\n.md-msg__close[data-v-db5ba171] { opacity: 0.6; cursor: pointer; background: none; border: 0;\n}\n.md-msg__close[data-v-db5ba171]:hover { opacity: 1;\n}\n.md-msg--info[data-v-db5ba171] { background: var(--md-info-bg); border-color: var(--md-info-border); color: var(--md-info-fg);\n}\n.md-msg--success[data-v-db5ba171] { background: var(--md-success-bg); border-color: var(--md-success-border); color: var(--md-success-fg);\n}\n.md-msg--warn[data-v-db5ba171] { background: var(--md-surface)beb; border-color: var(--md-warning-border); color: var(--md-warning-fg);\n}\n.md-msg--error[data-v-db5ba171] { background: var(--md-danger-bg); border-color: var(--md-danger-border); color: var(--md-danger-fg);\n}\n\r\n/* Auto-save pill: fade + 4px vertical drift on enter/leave */\n.autosave-fade-enter-active[data-v-8a0c6ca5],\r\n.autosave-fade-leave-active[data-v-8a0c6ca5] {\r\n transition:\r\n opacity 0.2s ease,\r\n transform 0.2s ease;\n}\n.autosave-fade-enter-from[data-v-8a0c6ca5] {\r\n opacity: 0;\r\n transform: translateY(4px);\n}\n.autosave-fade-leave-to[data-v-8a0c6ca5] {\r\n opacity: 0;\r\n transform: translateY(-4px);\n}\r\n/*$vite$:1*/";
|
|
7231
|
+
const raw = "\n\n.md-input[data-v-3e558228] {\r\n width: 100%;\r\n padding: 0.325rem 0.625rem;\r\n font-size: 13px;\r\n line-height: 1.25rem;\r\n color: var(--md-text);\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.375rem;\r\n outline: none;\r\n transition: border-color 0.15s, box-shadow 0.15s;\n}\n.md-input[data-v-3e558228]::placeholder { color: var(--md-text-subtle);\n}\n.md-input[data-v-3e558228]:focus {\r\n border-color: var(--md-primary);\n}\n.md-input[data-v-3e558228]:disabled { background: var(--md-surface-hover); color: var(--md-text-subtle); cursor: not-allowed;\n}\n.md-input--invalid[data-v-3e558228] { border-color: var(--md-danger);\n}\n.md-input--invalid[data-v-3e558228]:focus { border-color: var(--md-danger); box-shadow: 0 0 0 1px var(--md-danger);\n}\r\n\r\n/* =========================================================\r\n SELECT ROOT\r\n ========================================================= */\n.md-sel__anchor {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.25rem;\r\n width: 100%;\r\n min-height: 32px;\r\n box-sizing: border-box;\r\n padding: 0 0.375rem 0 0.5rem;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.375rem;\r\n font-size: 13px;\r\n color: var(--md-text);\n}\n.md-sel__anchor:focus-within {\r\n border-color: var(--md-primary);\n}\n.md-sel__anchor--open {\r\n border-color: var(--md-primary);\n}\n.md-sel__anchor--disabled {\r\n background: var(--md-surface-hover);\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n SEARCH INPUT\r\n ========================================================= */\n.md-sel__input {\r\n flex: 1;\r\n min-width: 0;\r\n width: 100%;\r\n box-sizing: border-box;\r\n padding: 0.375rem 0;\r\n border: 0;\r\n outline: none;\r\n background: transparent;\r\n font-family: inherit;\r\n font-size: 13px;\r\n line-height: 1.25rem;\r\n color: var(--md-text);\n}\n.md-sel__input::placeholder {\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n NON-FILTERED TRIGGER\r\n ========================================================= */\n.md-sel__triggerText {\r\n flex: 1;\r\n min-width: 0;\r\n box-sizing: border-box;\r\n padding: 0.375rem 0;\r\n border: 0;\r\n outline: none;\r\n background: transparent;\r\n cursor: pointer;\r\n font-family: inherit;\r\n font-size: 13px;\r\n color: var(--md-text);\r\n text-align: left;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\n}\n.md-sel__ph {\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n CHEVRON\r\n ========================================================= */\n.md-sel__chev {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n width: 20px;\r\n height: 20px;\r\n padding: 0;\r\n border: 0;\r\n outline: none;\r\n background: transparent;\r\n cursor: pointer;\r\n color: var(--md-text-muted);\r\n transition:\r\n transform 150ms ease,\r\n color 150ms ease;\n}\n.md-sel__chev--open {\r\n transform: rotate(180deg);\r\n color: var(--md-text);\n}\r\n\r\n/* =========================================================\r\n DROPDOWN\r\n ========================================================= */\n.md-sel__content {\r\n position: relative;\r\n z-index: 999999;\r\n width: var(--reka-combobox-trigger-width);\r\n min-width: 180px;\r\n max-width: 320px;\r\n box-sizing: border-box;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.5rem;\r\n box-shadow:\r\n 0 10px 15px -3px rgb(0 0 0 / 0.12),\r\n 0 4px 6px -4px rgb(0 0 0 / 0.12);\r\n overflow: hidden;\n}\r\n\r\n/* =========================================================\r\n DROPDOWN VIEWPORT\r\n ========================================================= */\n.md-sel__viewport {\r\n width: 100%;\r\n max-height: 240px;\r\n box-sizing: border-box;\r\n overflow-x: hidden;\r\n overflow-y: auto;\r\n padding: 4px;\r\n background: var(--md-surface);\n}\r\n\r\n/* =========================================================\r\n EMPTY\r\n ========================================================= */\n.md-sel__empty {\r\n display: block;\r\n width: 100%;\r\n box-sizing: border-box;\r\n padding: 8px;\r\n background: var(--md-surface);\r\n font-family: inherit;\r\n font-size: 12px;\r\n color: var(--md-text-subtle);\r\n text-align: center;\n}\r\n\r\n/* =========================================================\r\n OPTION\r\n ========================================================= */\n.md-sel__item {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n min-height: 32px;\r\n box-sizing: border-box;\r\n gap: 8px;\r\n padding: 6px 8px;\r\n background: var(--md-surface);\r\n border: 0;\r\n border-radius: 6px;\r\n font-family: inherit;\r\n font-size: 13px;\r\n line-height: 18px;\r\n color: var(--md-text);\r\n cursor: pointer;\r\n outline: none;\r\n user-select: none;\n}\n.md-sel__item:hover {\r\n background: var(--md-surface-muted);\n}\n.md-sel__item[data-highlighted] {\r\n background: var(--md-surface-muted);\n}\n.md-sel__item[data-state=\"checked\"] {\r\n background: var(--md-success-bg);\r\n color: var(--md-success-fg);\r\n font-weight: 500;\n}\n.md-sel__item[data-state=\"checked\"][data-highlighted] {\r\n background: color-mix(in srgb, var(--md-success) 20%, var(--md-success-bg));\n}\r\n\r\n/* =========================================================\r\n OPTION TEXT\r\n ========================================================= */\n.md-sel__itemLabel {\r\n flex: 1;\r\n min-width: 0;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\n}\r\n\r\n/* =========================================================\r\n CHECK\r\n ========================================================= */\n.md-sel__check {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n width: 16px;\r\n height: 16px;\r\n font-size: 12px;\r\n color: currentColor;\n}\r\n\n.section-fade-enter-active[data-v-9ae9089d],\r\n.section-fade-leave-active[data-v-9ae9089d] {\r\n transition: opacity 0.15s ease, transform 0.15s ease;\n}\n.section-fade-enter-from[data-v-9ae9089d],\r\n.section-fade-leave-to[data-v-9ae9089d] {\r\n opacity: 0;\r\n transform: translateY(-3px);\n}\r\n\n.transparent-swatch[data-v-e240a193] {\r\n background-image:\r\n linear-gradient(45deg, #ccc 25%, transparent 25%),\r\n linear-gradient(-45deg, #ccc 25%, transparent 25%),\r\n linear-gradient(45deg, transparent 75%, #ccc 75%),\r\n linear-gradient(-45deg, transparent 75%, #ccc 75%);\r\n background-size: 6px 6px;\r\n background-position: 0 0, 0 3px, 3px -3px, -3px 0;\r\n background-color: white;\n}\r\n\n.transparent-swatch[data-v-936cb96e] {\r\n background-image:\r\n linear-gradient(45deg, #ccc 25%, transparent 25%),\r\n linear-gradient(-45deg, #ccc 25%, transparent 25%),\r\n linear-gradient(45deg, transparent 75%, #ccc 75%),\r\n linear-gradient(-45deg, transparent 75%, #ccc 75%);\r\n background-size: 6px 6px;\r\n background-position: 0 0, 0 3px, 3px -3px, -3px 0;\r\n background-color: white;\n}\r\n\r\n/* =========================================================\r\n FIELD\r\n ========================================================= */\n.md-dp__field {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.0625rem;\r\n width: 100%;\r\n min-height: 32px;\r\n box-sizing: border-box;\r\n padding: 0.375rem 0.375rem 0.375rem 0.5rem;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.375rem;\r\n font-family: inherit;\r\n font-size: 13px;\r\n color: var(--md-text);\n}\n.md-dp__field:focus-within {\r\n border-color: var(--md-primary);\r\n box-shadow: 0 0 0 1px var(--md-primary);\n}\r\n\r\n/* =========================================================\r\n DATE SEGMENTS\r\n ========================================================= */\n.md-dp__seg {\r\n padding: 0 0.0625rem;\r\n border-radius: 0.125rem;\r\n outline: none;\r\n font-family: inherit;\r\n font-size: 13px;\n}\n.md-dp__seg:focus {\r\n background: var(--md-primary);\r\n color: var(--md-surface);\n}\n.md-dp__seg[data-placeholder] {\r\n color: var(--md-text-subtle);\n}\n.md-dp__lit {\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n CALENDAR TRIGGER\r\n ========================================================= */\n.md-dp__trigger {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n margin-left: auto;\r\n width: 20px;\r\n height: 20px;\r\n padding: 0.125rem;\r\n border: 0;\r\n background: transparent;\r\n cursor: pointer;\r\n font-size: 11px;\r\n color: var(--md-text-subtle);\n}\n.md-dp__trigger:hover {\r\n color: var(--md-text-muted);\n}\r\n\r\n/* =========================================================\r\n CALENDAR POPOVER\r\n ========================================================= */\n.md-dp__content {\r\n z-index: 999999;\r\n padding: 0.625rem;\r\n box-sizing: border-box;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.625rem;\r\n box-shadow:\r\n 0 10px 15px -3px rgb(0 0 0 / 0.12),\r\n 0 4px 6px -4px rgb(0 0 0 / 0.12);\n}\r\n\r\n/* =========================================================\r\n CALENDAR\r\n ========================================================= */\n.md-dp__cal {\r\n width: max-content;\n}\r\n\r\n/* =========================================================\r\n HEADER\r\n ========================================================= */\n.md-dp__header {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n margin-bottom: 0.5rem;\n}\n.md-dp__heading {\r\n font-family: inherit;\r\n font-size: 13px;\r\n font-weight: 600;\r\n color: var(--md-text);\n}\r\n\r\n/* =========================================================\r\n PREVIOUS / NEXT\r\n ========================================================= */\n.md-dp__nav {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 24px;\r\n height: 24px;\r\n padding: 0.25rem;\r\n border: 0;\r\n background: transparent;\r\n border-radius: 0.25rem;\r\n cursor: pointer;\r\n font-size: 12px;\r\n color: var(--md-text-muted);\n}\n.md-dp__nav:hover {\r\n background: var(--md-surface-muted);\r\n color: var(--md-text);\n}\n.md-dp__nav:disabled {\r\n opacity: 0.4;\r\n cursor: default;\n}\r\n\r\n/* =========================================================\r\n GRID\r\n ========================================================= */\n.md-dp__grid {\r\n width: 100%;\r\n border-collapse: collapse;\n}\n.md-dp__row {\r\n display: flex;\n}\r\n\r\n/* =========================================================\r\n WEEKDAY HEADER\r\n ========================================================= */\n.md-dp__headCell {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 32px;\r\n height: 28px;\r\n font-family: inherit;\r\n font-size: 11px;\r\n font-weight: 500;\r\n color: var(--md-text-subtle);\n}\r\n\r\n/* =========================================================\r\n DAY BUTTON\r\n ========================================================= */\n.md-dp__day {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 32px;\r\n height: 30px;\r\n padding: 0;\r\n border: 0;\r\n background: transparent;\r\n font-family: inherit;\r\n font-size: 12px;\r\n color: var(--md-text);\r\n border-radius: 0.3125rem;\r\n cursor: pointer;\r\n outline: none;\r\n transition:\r\n background 100ms ease,\r\n color 100ms ease;\n}\n.md-dp__day:hover {\r\n background: var(--md-surface-muted);\n}\n.md-dp__day:focus-visible {\r\n outline: 2px solid var(--md-primary);\r\n outline-offset: -2px;\n}\r\n\r\n/* =========================================================\r\n SELECTED DAY\r\n ========================================================= */\n.md-dp__day[data-selected] {\r\n background: var(--md-primary);\r\n color: var(--md-surface);\r\n font-weight: 600;\n}\n.md-dp__day[data-selected]:hover {\r\n background: var(--md-primary);\n}\r\n\r\n/* =========================================================\r\n TODAY\r\n ========================================================= */\n.md-dp__day[data-today]:not([data-selected]) {\r\n font-weight: 700;\r\n color: var(--md-primary);\n}\r\n\r\n/* =========================================================\r\n OUTSIDE / DISABLED\r\n ========================================================= */\n.md-dp__day[data-outside-view] {\r\n color: var(--md-border-strong);\n}\n.md-dp__day[data-disabled] {\r\n color: var(--md-border-strong);\r\n\r\n cursor: default;\n}\n.md-dp__day[data-disabled]:hover {\r\n background: transparent;\n}\r\n\n.rules-scroll[data-v-ce314c0b] {\r\n overflow-x: auto;\r\n max-width: 100%;\r\n -webkit-overflow-scrolling: touch;\n}\n.rules-scroll[data-v-ce314c0b]::-webkit-scrollbar {\r\n height: 6px;\n}\n.rules-scroll[data-v-ce314c0b]::-webkit-scrollbar-track {\r\n background: var(--md-surface-muted);\r\n border-radius: 4px;\n}\n.rules-scroll[data-v-ce314c0b]::-webkit-scrollbar-thumb {\r\n background: var(--md-border-strong);\r\n border-radius: 4px;\n}\n.rules-scroll[data-v-ce314c0b]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.toggle-btn[data-v-2dd9f5a7] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 28px;\r\n border-radius: 6px;\r\n border: 0.5px solid transparent;\r\n cursor: pointer;\r\n transition:\r\n background 0.1s,\r\n border-color 0.1s,\r\n color 0.1s;\r\n background: transparent;\r\n padding: 0;\r\n outline: none;\n}\n.toggle-btn[data-v-2dd9f5a7]:focus-visible {\r\n box-shadow: 0 0 0 2px var(--md-selection);\n}\n.toggle-btn--idle[data-v-2dd9f5a7] {\r\n border-color: var(--md-border);\r\n color: var(--md-text-subtle);\n}\n.toggle-btn--idle[data-v-2dd9f5a7]:hover {\r\n background: var(--md-surface-hover);\r\n border-color: var(--md-border-strong);\n}\n.toggle-btn--active[data-v-2dd9f5a7] {\r\n background: var(--md-selection-bg);\r\n border-color: var(--md-selection);\r\n color: var(--md-selection-fg);\n}\n.toggle-btn--active[data-v-2dd9f5a7]:hover {\r\n background: color-mix(in srgb, var(--md-selection) 20%, var(--md-selection-bg));\n}\r\n\n.md-btn[data-v-cc741dfc] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 0.375rem;\n padding: 0.5rem 0.875rem;\n font-size: 13px;\n font-weight: 500;\n border-radius: 0.375rem;\n border: 1px solid transparent;\n cursor: pointer;\n transition: background-color 0.15s, border-color 0.15s, opacity 0.15s;\n}\n.md-btn[data-v-cc741dfc]:disabled { opacity: 0.55; cursor: not-allowed;\n}\n.md-btn--primary[data-v-cc741dfc] {\n background: var(--md-button-primary-bg);\n color: var(--md-button-primary-text);\n}\n.md-btn--primary[data-v-cc741dfc]:not(:disabled):hover { background: var(--md-button-primary-hover-bg);\n}\n.md-btn--secondary[data-v-cc741dfc] {\n background: var(--md-button-secondary-bg);\n color: var(--md-button-secondary-text);\n border-color: var(--md-border);\n}\n.md-btn--secondary[data-v-cc741dfc]:not(:disabled):hover { background: var(--md-button-secondary-hover-bg);\n}\n.md-btn--danger[data-v-cc741dfc] { background: var(--md-danger); color: var(--md-on-danger);\n}\n.md-btn--danger[data-v-cc741dfc]:not(:disabled):hover { filter: brightness(0.94);\n}\n.md-btn--success[data-v-cc741dfc] { background: var(--md-success); color: var(--md-surface);\n}\n\n.md-dialog__overlay[data-v-0b61b47b] {\n position: fixed;\n inset: 0;\n z-index: 9998;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n background: rgb(0 0 0 / 0.4);\n}\n.md-dialog[data-v-0b61b47b] {\n width: 420px;\n max-width: 100%;\n max-height: calc(100vh - 2rem);\n display: flex;\n flex-direction: column;\n background: var(--md-surface);\n border-radius: 0.75rem;\n box-shadow: 0 20px 60px rgb(0 0 0 / 0.25);\n outline: none;\n}\n.md-dialog__header[data-v-0b61b47b] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n padding: 1.125rem 1.25rem 0.5rem;\n}\n.md-dialog__header--noTitle[data-v-0b61b47b] { justify-content: flex-end;\n}\n.md-dialog__title[data-v-0b61b47b] { font-size: 17px; font-weight: 600; color: var(--md-text); margin: 0;\n}\n.md-dialog__close[data-v-0b61b47b] {\n display: inline-flex;\n padding: 0.25rem;\n color: var(--md-text-subtle);\n background: none;\n border: 0;\n border-radius: 0.25rem;\n cursor: pointer;\n}\n.md-dialog__close[data-v-0b61b47b]:hover { color: var(--md-text); background: var(--md-surface-muted);\n}\n.md-dialog__body[data-v-0b61b47b] {\n padding: 0.5rem 1.25rem 1.25rem;\n overflow-y: auto;\n font-size: 14px;\n color: var(--md-text);\n}\n.md-dialog__footer[data-v-0b61b47b] {\n display: flex;\n justify-content: flex-end;\n gap: 0.5rem;\n padding: 0 1.25rem 1.25rem;\n}\n.md-dialog__srOnly[data-v-0b61b47b] {\n position: absolute;\n width: 1px; height: 1px;\n padding: 0; margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n}\n\n[data-v-5aa602c3] a {\r\n color: #2563eb;\r\n cursor: pointer;\n}\n[data-v-5aa602c3] a:not([style*=\"text-decoration\"]) {\r\n text-decoration: underline;\n}\n[data-v-5aa602c3] a:hover {\r\n opacity: 0.8;\n}\r\n\r\n/* Merge tag node — inline chip styling.\r\n display:inline ensures the span is exactly as wide as its text content.\r\n No width reservation from hidden raw-tag text since the NodeView\r\n writes only one text node at a time. */\n[data-v-5aa602c3] .merge-tag-node {\r\n display: inline;\r\n white-space: nowrap;\r\n vertical-align: baseline;\r\n cursor: default;\r\n border-radius: 3px;\r\n padding: 0 2px;\n}\r\n\r\n/* List styles — scoped to the editor content area */\n[data-v-5aa602c3] li:not(:last-child) {\r\n margin-bottom: var(--list-item-spacing, 0.25rem);\n}\r\n\r\n/* ─── Toolbar font Select sizing ─────────────────────────────────────────────\r\n Constrain the Select to sit flush inside the toolbar row.\r\n The trigger is kept compact (28px tall) and the overlay is widened so\r\n long font names are readable without being clipped. */\n.toolbar-font-select[data-v-5aa602c3] .p-select {\r\n height: 28px;\r\n min-width: 110px;\r\n max-width: 130px;\r\n border-radius: 6px;\r\n border-color: var(\r\n --md-toolbar-border\r\n ); /* matches other toolbar button borders */\r\n padding: 0 6px;\r\n font-size: 0.75rem;\r\n display: flex;\r\n align-items: center;\n}\n.toolbar-font-select[data-v-5aa602c3] .p-select-label {\r\n padding: 0;\r\n font-size: 0.85rem;\r\n line-height: 1;\n}\n.toolbar-font-select[data-v-5aa602c3] .p-select-dropdown {\r\n width: 20px;\n}\r\n\r\n/* Widen the overlay panel so long font names are not clipped */\n[data-v-5aa602c3] .p-select-overlay {\r\n min-width: 180px !important;\n}\r\n\n.toggle-btn[data-v-916ac99b] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 28px;\r\n border-radius: 6px;\r\n border: 0.5px solid transparent;\r\n cursor: pointer;\r\n transition: background 0.1s, border-color 0.1s, color 0.1s;\r\n background: transparent;\r\n padding: 0;\r\n outline: none;\n}\n.toggle-btn--idle[data-v-916ac99b] {\r\n border-color: color-mix(in srgb, var(--md-border) 80%, transparent);\r\n color: var(--md-text-subtle);\n}\n.toggle-btn--idle[data-v-916ac99b]:hover {\r\n background: var(--md-surface-hover);\r\n border-color: var(--md-border-strong);\r\n color: var(--md-text-muted);\n}\n.toggle-btn--active[data-v-916ac99b] {\r\n background: var(--md-selection-bg);\r\n border-color: var(--md-selection);\r\n color: var(--md-selection-fg);\n}\n.toggle-btn--active[data-v-916ac99b]:hover {\r\n background: color-mix(in srgb, var(--md-selection) 20%, var(--md-selection-bg));\n}\r\n\n.panel[data-v-1ca75986] {\r\n padding: 10px 12px;\r\n background: var(--md-surface);\r\n border: 0.5px solid color-mix(in srgb, var(--md-border) 80%, transparent);\r\n border-radius: 10px;\n}\n.separator[data-v-1ca75986] {\r\n height: 0.5px;\r\n background: color-mix(in srgb, var(--md-border) 80%, transparent);\r\n margin-left: -12px;\r\n margin-right: -12px;\n}\r\n\n.spinner[data-v-3ea84dc7] {\r\n width: 50px;\r\n height: 50px;\r\n border: 5px solid rgba(0, 0, 0, 0.2);\r\n border-top-color: var(--md-selection);\r\n border-radius: 50%;\r\n margin: 0 auto;\r\n animation: spin-3ea84dc7 1s linear infinite;\n}\n@keyframes spin-3ea84dc7 {\nto {\r\n transform: rotate(360deg);\n}\n}\r\n\r\n/* ===== DESIGN SYSTEM TOKENS =====\r\n * Each token reads from the shared --md-* custom properties (see theme.ts)\r\n * and falls back to this component's original hardcoded value when the\r\n * host hasn't set that property. That means an untouched app looks exactly\r\n * as before, and a host calling setEditorTheme() re-themes this notice too,\r\n * without editing this file again. */\n.desktop-gate[data-v-f2e384b2] {\r\n --brand-primary: var(--md-primary, #4a7c59);\r\n --brand-primary-dark: var(--md-primary-hover, #3a5a40);\r\n --brand-primary-light: var(--md-primary-hover, #3a5a40);\r\n --brand-gradient-start: var(--md-primary, #4a7c59);\r\n --brand-gradient-end: var(--md-primary-hover, #3a5a40);\r\n --gate-surface: var(--md-surface, #ffffff);\r\n --gate-backdrop: var(--md-background, #f9fafb);\r\n --gate-on-primary: var(--md-on-primary, #ffffff);\r\n --gate-warning: var(--md-warning, #f59e0b);\r\n --gray-50: var(--md-background, #f9fafb);\r\n --gray-100: var(--md-surface-muted, #f3f4f6);\r\n --gray-200: var(--md-border, #e5e7eb);\r\n --gray-300: var(--md-border-strong, #d1d5db);\r\n --gray-400: var(--md-text-subtle, #9ca3af);\r\n --gray-500: var(--md-text-subtle, #6b7280);\r\n --gray-600: var(--md-text-muted, #4b5563);\r\n --gray-700: var(--md-text-muted, #374151);\r\n --gray-800: var(--md-text, #1f2937);\r\n --gray-900: var(--md-text, #111827);\r\n --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\r\n --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\r\n --shadow-lg:\r\n 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\r\n --shadow-xl:\r\n 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\r\n --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n}\r\n\r\n/* ===== MAIN LAYOUT ===== */\n.desktop-gate[data-v-f2e384b2] {\r\n position: fixed;\r\n inset: 0;\r\n z-index: 9999;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n background: color-mix(in srgb, var(--gate-backdrop) 98%, transparent);\r\n backdrop-filter: blur(2px);\r\n padding: 1.5rem;\n}\n.gate-container[data-v-f2e384b2] {\r\n max-width: 520px;\r\n width: 100%;\r\n background: var(--gate-surface);\r\n border-radius: 2rem;\r\n padding: 2.5rem;\r\n text-align: center;\r\n box-shadow: var(--shadow-2xl);\r\n animation: fadeInUp-f2e384b2 0.5s cubic-bezier(0.16, 1, 0.3, 1);\r\n border: 1px solid var(--gray-200);\n}\r\n\r\n/* ===== BRAND BADGE ===== */\n.brand-badge[data-v-f2e384b2] {\r\n position: relative;\r\n width: 80px;\r\n height: 80px;\r\n margin: 0 auto 1.5rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\n}\n.badge-ring[data-v-f2e384b2] {\r\n position: absolute;\r\n inset: 0;\r\n border-radius: 50%;\r\n background: linear-gradient(\r\n 135deg,\r\n var(--brand-gradient-start),\r\n var(--brand-gradient-end)\r\n );\r\n animation: pulseRing-f2e384b2 2s ease-out infinite;\n}\n.badge-icon[data-v-f2e384b2] {\r\n position: relative;\r\n width: 56px;\r\n height: 56px;\r\n background: var(--gate-surface);\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--brand-primary);\r\n box-shadow: var(--shadow-md);\r\n transition: transform 0.2s ease;\n}\n.gate-container:hover .badge-icon[data-v-f2e384b2] {\r\n transform: scale(1.02);\n}\r\n\r\n/* ===== TYPOGRAPHY ===== */\n.gate-title[data-v-f2e384b2] {\r\n font-size: 1.875rem;\r\n font-weight: 700;\r\n letter-spacing: -0.02em;\r\n margin: 0 0 1rem 0;\r\n color: var(--gray-900);\n}\n.brand-gradient[data-v-f2e384b2] {\r\n background: linear-gradient(\r\n 135deg,\r\n var(--brand-gradient-start),\r\n var(--brand-gradient-end)\r\n );\r\n background-clip: text;\r\n -webkit-background-clip: text;\r\n color: transparent;\n}\n.gate-description[data-v-f2e384b2] {\r\n font-size: 1rem;\r\n line-height: 1.5;\r\n color: var(--gray-600);\r\n margin: 0 0 1.75rem 0;\n}\r\n\r\n/* ===== FEATURE GRID ===== */\n.feature-grid[data-v-f2e384b2] {\r\n display: flex;\r\n justify-content: center;\r\n gap: 2rem;\r\n margin-bottom: 2rem;\r\n padding: 1rem 0;\r\n border-top: 1px solid var(--gray-200);\r\n border-bottom: 1px solid var(--gray-200);\n}\n.feature-item[data-v-f2e384b2] {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 0.5rem;\r\n font-size: 0.75rem;\r\n font-weight: 500;\r\n color: var(--gray-700);\n}\n.feature-icon[data-v-f2e384b2] {\r\n width: 36px;\r\n height: 36px;\r\n background: var(--gray-100);\r\n border-radius: 12px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: var(--brand-primary);\r\n transition: all 0.2s ease;\n}\n.feature-item:hover .feature-icon[data-v-f2e384b2] {\r\n background: var(--brand-primary);\r\n color: var(--gate-on-primary);\r\n transform: translateY(-2px);\n}\r\n\r\n/* ===== STATUS ===== */\n.detection-status[data-v-f2e384b2] {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 0.5rem;\r\n padding: 0.5rem 1rem;\r\n background: var(--gray-100);\r\n border-radius: 100px;\r\n font-size: 0.75rem;\r\n font-weight: 500;\r\n color: var(--gray-600);\n}\n.status-dot[data-v-f2e384b2] {\r\n width: 8px;\r\n height: 8px;\r\n background: var(--gate-warning);\r\n border-radius: 50%;\r\n animation: pulse-f2e384b2 1.5s ease-out infinite;\n}\r\n\r\n/* ===== FOOTER ===== */\n.gate-footer[data-v-f2e384b2] {\r\n margin-top: 2rem;\r\n padding-top: 1.5rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 0.5rem;\r\n font-size: 0.75rem;\r\n color: var(--gray-400);\n}\n.brand-text[data-v-f2e384b2] {\r\n font-weight: 600;\r\n background: linear-gradient(\r\n 135deg,\r\n var(--brand-gradient-start),\r\n var(--brand-gradient-end)\r\n );\r\n background-clip: text;\r\n -webkit-background-clip: text;\r\n color: transparent;\n}\r\n\r\n/* ===== ANIMATIONS ===== */\n@keyframes fadeInUp-f2e384b2 {\nfrom {\r\n opacity: 0;\r\n transform: translateY(20px);\n}\nto {\r\n opacity: 1;\r\n transform: translateY(0);\n}\n}\n@keyframes pulseRing-f2e384b2 {\n0% {\r\n opacity: 1;\r\n transform: scale(0.95);\n}\n70% {\r\n opacity: 0.4;\r\n transform: scale(1.15);\n}\n100% {\r\n opacity: 0;\r\n transform: scale(1.25);\n}\n}\n@keyframes pulse-f2e384b2 {\n0%,\r\n 100% {\r\n opacity: 1;\n}\n50% {\r\n opacity: 0.4;\n}\n}\r\n\r\n/* ===== RESPONSIVE TOUCH-UPS ===== */\n@media (max-width: 480px) {\n.gate-container[data-v-f2e384b2] {\r\n padding: 2rem 1.5rem;\n}\n.gate-title[data-v-f2e384b2] {\r\n font-size: 1.5rem;\n}\n.feature-grid[data-v-f2e384b2] {\r\n gap: 1.25rem;\n}\n}\r\n\n.row-drop-bar[data-v-601d4b22] {\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n height: 28px;\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n padding: 0 16px;\r\n background: color-mix(in srgb, var(--drop-color) 5%, transparent);\r\n border-radius: 6px;\r\n z-index: 20;\r\n pointer-events: none;\n}\n.row-drop-bar--before[data-v-601d4b22] {\r\n top: -14px;\n}\n.row-drop-bar--after[data-v-601d4b22] {\r\n bottom: -14px;\n}\n.row-drop-bar-line[data-v-601d4b22] {\r\n flex: 1;\r\n height: 2px;\r\n background: color-mix(in srgb, var(--drop-color) 50%, transparent);\r\n border-radius: 2px;\r\n /* animation: bar-expand 0.18s ease forwards; */\n}\r\n\r\n/* @keyframes bar-expand {\r\n from {\r\n transform: scaleX(0);\r\n opacity: 0;\r\n }\r\n to {\r\n transform: scaleX(1);\r\n opacity: 1;\r\n }\r\n} */\n.row-drop-bar-label[data-v-601d4b22] {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\r\n font-size: 11px;\r\n font-weight: 500;\r\n color: var(--drop-color);\r\n white-space: nowrap;\r\n padding: 4px 12px;\r\n background: color-mix(in srgb, var(--drop-color) 10%, transparent);\r\n border: 1px solid color-mix(in srgb, var(--drop-color) 30%, transparent);\r\n border-radius: 24px;\r\n /* animation: label-pop 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; */\n}\r\n\r\n/* @keyframes label-pop {\r\n from {\r\n transform: scale(0.8);\r\n opacity: 0;\r\n }\r\n to {\r\n transform: scale(1);\r\n opacity: 1;\r\n }\r\n} */\n.row-drop-bar-icon[data-v-601d4b22] {\r\n width: 12px;\r\n height: 12px;\r\n flex-shrink: 0;\n}\r\n\r\n/* Transition */\r\n/* .drop-bar-enter-active {\r\n animation: bar-in 0.15s ease forwards;\r\n}\r\n.drop-bar-leave-active {\r\n transition: opacity 0.12s ease;\r\n}\r\n.drop-bar-leave-to {\r\n opacity: 0;\r\n} */\r\n\r\n/* @keyframes bar-in {\r\n from {\r\n opacity: 0;\r\n }\r\n to {\r\n opacity: 1;\r\n }\r\n} */\r\n\n.fade-enter-active[data-v-7f93ba61],\r\n.fade-leave-active[data-v-7f93ba61] {\r\n transition: opacity 0.1s ease;\n}\n.fade-enter-from[data-v-7f93ba61],\r\n.fade-leave-to[data-v-7f93ba61] {\r\n opacity: 0;\n}\r\n\r\n/*\r\n * Stacking fix: CanvasRowDropZone has z-index: 9 and extends its hit-area\r\n * strip into adjacent rows when a layout drag is active. Without an explicit\r\n * stacking context on the column, that strip would catch pointer events for\r\n * the edges of the column — the row drop zone would win and the drop would\r\n * become a top-level row instead of a nested row.\r\n *\r\n * z-index: 1 creates a stacking context ABOVE the drop zone's hit strip.\r\n *\r\n * CRITICAL: When a child component is selected, we must set z-index: auto on\r\n * this column AND on its ancestor CanvasRow (via hasSelectedDescendant).\r\n * z-index: auto removes the column from the stacking context chain entirely,\r\n * letting the selected component's z-50 bubble up to compete at the canvas\r\n * root level — which is what allows the action bar and RichText toolbar to\r\n * paint above sibling rows. If z-index: 1 stays active, ANY z-index on a\r\n * child is capped within this column's own stacking context and can never\r\n * exceed a sibling row painted at z-index: 0 in normal flow.\r\n */\n.canvas-column[data-v-7f93ba61] {\r\n position: relative;\r\n z-index: 1;\n}\n.canvas-column.has-selected-child[data-v-7f93ba61] {\r\n z-index: auto;\n}\r\n\r\n/* ── Base zone ─────────────────────────────────────────────── */\n.canvas-drop-zone[data-v-cc281ed8] {\r\n position: relative;\r\n height: 0;\r\n margin: 0;\r\n z-index: 9;\r\n overflow: visible;\r\n transition: height 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\r\n\r\n/* Full expansion on hover */\n.canvas-drop-zone--active[data-v-cc281ed8] {\r\n height: 52px;\n}\r\n\r\n/* Empty-canvas variant — fills the whole empty area */\n.canvas-drop-zone--empty[data-v-cc281ed8] {\r\n height: 100%;\r\n min-height: 200px;\n}\r\n\r\n/* Full height variant - takes up entire parent container */\n.canvas-drop-zone--full[data-v-cc281ed8] {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n height: auto;\r\n min-height: 100%;\n}\n.canvas-drop-zone--empty .cdz-bar[data-v-cc281ed8] {\r\n inset: 12px;\r\n justify-content: center;\r\n border-radius: 12px;\n}\r\n\r\n/* ── Empty state styles (when fullHeight is true) ── */\n.cdz-empty-state[data-v-cc281ed8] {\r\n position: absolute;\r\n inset: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: none;\r\n background: linear-gradient(\r\n 135deg,\r\n color-mix(in srgb, var(--md-row-selection) 4%, var(--md-surface)) 0%,\r\n color-mix(in srgb, var(--md-row-selection) 8%, var(--md-surface)) 100%\r\n );\r\n border: 2px dashed color-mix(in srgb, var(--md-row-selection) 22%, var(--md-surface));\r\n border-radius: 6px;\r\n transition: all 0.2s ease;\n}\n.canvas-drop-zone--full .cdz-empty-state[data-v-cc281ed8] {\r\n animation: fade-in-cc281ed8 0.3s ease;\n}\n@keyframes fade-in-cc281ed8 {\nfrom {\r\n opacity: 0;\r\n transform: scale(0.98);\n}\nto {\r\n opacity: 1;\r\n transform: scale(1);\n}\n}\n.cdz-empty-content[data-v-cc281ed8] {\r\n text-align: center;\r\n padding: 2rem;\n}\n.cdz-empty-icon[data-v-cc281ed8] {\r\n width: 48px;\r\n height: 48px;\r\n margin: 0 auto 12px;\r\n color: var(--md-text-subtle);\r\n stroke-width: 1.5;\n}\n.cdz-empty-title[data-v-cc281ed8] {\r\n font-size: 1.125rem;\r\n font-weight: 500;\r\n color: var(--md-selection-fg);\r\n margin-bottom: 8px;\r\n letter-spacing: -0.01em;\n}\n.cdz-empty-subtitle[data-v-cc281ed8] {\r\n font-size: 0.875rem;\r\n color: var(--md-text-subtle);\r\n line-height: 1.4;\n}\r\n\r\n/* ── Invisible hit-area ─────────────────────────────────────\r\n * Previously this bled 12px into the rows above and below with pointer-events\r\n * all during a layout drag. That meant dragging a LayoutTab row would hit this\r\n * strip when the cursor was merely near a column's top/bottom edge, and\r\n * insert a top-level row instead of a nested row.\r\n *\r\n * FIX: Shrink the bleed to a small value (−4px) so the strip only covers the\r\n * natural visible gap between rows. Columns retain ownership of their rendered\r\n * area. Combined with CanvasColumn's new z-index: 1 stacking context, the\r\n * column reliably wins for pointer hits inside its body, while the thin gap\r\n * between rows still belongs to this drop zone.\r\n *\r\n * When fully expanded (canvas-drop-zone--active: 52px tall) the zone's own\r\n * height covers the hit area naturally, so bleed here is not needed for the\r\n * \"snap into a big target\" UX — that comes from the zone's own expanded size.\r\n */\n.cdz-hit-area[data-v-cc281ed8] {\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n top: -4px;\r\n bottom: -4px;\r\n z-index: 1;\r\n /* Only catchable during a layout drag; invisible + inert otherwise */\r\n pointer-events: none;\n}\n.canvas-drop-zone--receptive .cdz-hit-area[data-v-cc281ed8] {\r\n pointer-events: all;\n}\r\n\r\n/* Hide empty state when dragging */\n.canvas-drop-zone--full.canvas-drop-zone--receptive .cdz-empty-state[data-v-cc281ed8],\r\n.canvas-drop-zone--full.canvas-drop-zone--active .cdz-empty-state[data-v-cc281ed8] {\r\n opacity: 0.5;\r\n background: color-mix(in srgb, var(--md-row-selection) 4%, transparent);\n}\r\n\r\n/* ── Ghost line (receptive but not hovered) ─────────────────── */\n.cdz-ghost-line[data-v-cc281ed8] {\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n top: 50%;\r\n height: 2px;\r\n transform: translateY(-50%);\r\n background: repeating-linear-gradient(\r\n 90deg,\r\n color-mix(in srgb, var(--md-row-selection) 25%, transparent) 0px,\r\n color-mix(in srgb, var(--md-row-selection) 25%, transparent) 6px,\r\n transparent 6px,\r\n transparent 12px\r\n );\r\n border-radius: 2px;\r\n pointer-events: none;\r\n animation: ghost-pulse-cc281ed8 2s ease-in-out infinite;\n}\n@keyframes ghost-pulse-cc281ed8 {\n0%, 100% { opacity: 0.5;\n}\n50% { opacity: 1;\n}\n}\r\n\r\n/* ── Active bar ─────────────────────────────────────────────── */\n.cdz-bar[data-v-cc281ed8] {\r\n position: absolute;\r\n inset: 4px 0;\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n padding: 0 20px;\r\n background: color-mix(in srgb, var(--md-row-selection) 6%, transparent);\r\n border-radius: 8px;\r\n border: 1.5px dashed color-mix(in srgb, var(--md-row-selection) 35%, transparent);\r\n pointer-events: none; /* let drag events fall through to the parent drop zone */\n}\n.cdz-line[data-v-cc281ed8] {\r\n flex: 1;\r\n height: 2px;\r\n background: linear-gradient(\r\n 90deg,\r\n transparent,\r\n color-mix(in srgb, var(--md-row-selection) 60%, transparent),\r\n color-mix(in srgb, var(--md-row-selection) 80%, transparent),\r\n color-mix(in srgb, var(--md-row-selection) 60%, transparent),\r\n transparent\r\n );\r\n border-radius: 2px;\r\n animation: line-expand-cc281ed8 0.2s ease forwards;\r\n transform-origin: center;\n}\n@keyframes line-expand-cc281ed8 {\nfrom { transform: scaleX(0); opacity: 0;\n}\nto { transform: scaleX(1); opacity: 1;\n}\n}\n.cdz-pill[data-v-cc281ed8] {\r\n display: flex;\r\n align-items: center;\r\n gap: 5px;\r\n font-size: 11px;\r\n font-weight: 600;\r\n color: var(--md-row-selection-fg);\r\n letter-spacing: 0.01em;\r\n white-space: nowrap;\r\n padding: 5px 14px;\r\n background: color-mix(in srgb, var(--md-row-selection) 8%, transparent);\r\n border: 1.5px solid color-mix(in srgb, var(--md-row-selection) 35%, transparent);\r\n border-radius: 100px;\r\n box-shadow: 0 2px 8px color-mix(in srgb, var(--md-row-selection) 15%, transparent);\r\n animation: pill-pop-cc281ed8 0.22s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;\n}\n@keyframes pill-pop-cc281ed8 {\nfrom { transform: scale(0.75); opacity: 0;\n}\nto { transform: scale(1); opacity: 1;\n}\n}\n.cdz-icon[data-v-cc281ed8] {\r\n width: 13px;\r\n height: 13px;\r\n flex-shrink: 0;\n}\r\n\r\n/* ── Transition ─────────────────────────────────────────────── */\n.cdz-bar-enter-active[data-v-cc281ed8] { animation: cdz-in-cc281ed8 0.15s ease forwards;\n}\n.cdz-bar-leave-active[data-v-cc281ed8] { transition: opacity 0.1s ease;\n}\n.cdz-bar-leave-to[data-v-cc281ed8] { opacity: 0;\n}\n@keyframes cdz-in-cc281ed8 {\nfrom { opacity: 0; transform: scaleY(0.6);\n}\nto { opacity: 1; transform: scaleY(1);\n}\n}\r\n\n.drop-line-enter-active[data-v-8ae7a24f] {\r\n transition: opacity 80ms ease, transform 80ms ease;\n}\n.drop-line-leave-active[data-v-8ae7a24f] {\r\n transition: opacity 60ms ease, transform 60ms ease;\n}\n.drop-line-enter-from[data-v-8ae7a24f],\r\n.drop-line-leave-to[data-v-8ae7a24f] {\r\n opacity: 0;\r\n transform: scaleX(0.6);\r\n transform-origin: left center;\n}\r\n\n.slide-enter-active[data-v-ce5a848e],\r\n.slide-leave-active[data-v-ce5a848e] {\r\n transition: all 0.2s ease;\r\n max-height: 500px;\r\n overflow: hidden;\n}\n.slide-enter-from[data-v-ce5a848e],\r\n.slide-leave-to[data-v-ce5a848e] {\r\n opacity: 0;\r\n max-height: 0;\r\n transform: translateY(-10px);\n}\r\n\r\n/* ============================================================\r\n md-dropdown – suggestion list\r\n ============================================================ */\n.md-dropdown[data-v-3cd230e0] {\r\n position: absolute;\r\n top: 100%;\r\n left: 0;\r\n right: 0;\r\n margin-top: 4px;\r\n background: var(--md-surface);\r\n border: 1px solid var(--md-border);\r\n border-radius: 0.375rem;\r\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\r\n z-index: 10;\r\n max-height: 12rem;\r\n overflow-y: auto;\n}\n.md-dropdown-item[data-v-3cd230e0] {\r\n padding: 0.5rem 0.75rem;\r\n cursor: pointer;\r\n color: var(--md-text);\r\n transition: background 0.1s;\n}\n.md-dropdown-item[data-v-3cd230e0]:hover {\r\n background: var(--md-surface-hover);\n}\n.md-dropdown-item--active[data-v-3cd230e0] {\r\n background: var(--md-primary);\r\n color: var(--md-on-primary);\n}\r\n\r\n/* ============================================================\r\n md-tag – selected tag pills\r\n ============================================================ */\n.md-tag[data-v-3cd230e0] {\r\n display: inline-flex;\r\n align-items: center;\r\n padding: 0.125rem 0.75rem; \r\n border-radius: 9999px;\r\n font-size: 0.875rem; \r\n font-weight: 500;\r\n background: var(--md-primary);\r\n color: var(--md-on-primary);\r\n line-height: 1.5;\n}\n.md-tag-remove[data-v-3cd230e0] {\r\n margin-left: 0.5rem;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 1rem;\r\n height: 1rem;\r\n border: none;\r\n background: transparent;\r\n color: color-mix(in srgb, var(--md-on-primary) 80%, transparent);\r\n cursor: pointer;\r\n border-radius: 9999px;\r\n transition:\r\n background 0.15s,\r\n color 0.15s;\r\n padding: 0;\n}\n.md-tag-remove[data-v-3cd230e0]:hover {\r\n background: color-mix(in srgb, var(--md-on-primary) 20%, transparent);\r\n color: var(--md-on-primary);\n}\n.md-tag-remove svg[data-v-3cd230e0] {\r\n width: 100%;\r\n height: 100%;\n}\r\n\r\n/* ============================================================\r\n Scrollbar styling for dropdown (optional, keeps it clean)\r\n ============================================================ */\n.md-dropdown[data-v-3cd230e0]::-webkit-scrollbar {\r\n width: 4px;\n}\n.md-dropdown[data-v-3cd230e0]::-webkit-scrollbar-track {\r\n background: transparent;\n}\n.md-dropdown[data-v-3cd230e0]::-webkit-scrollbar-thumb {\r\n background: var(--md-border);\r\n border-radius: 8px;\n}\n.md-dropdown[data-v-3cd230e0]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.overflow-x-auto[data-v-22183f86] {\r\n max-width: 100%;\r\n -webkit-overflow-scrolling: touch;\n}\n.overflow-x-auto[data-v-22183f86]::-webkit-scrollbar {\r\n height: 6px;\n}\n.overflow-x-auto[data-v-22183f86]::-webkit-scrollbar-track {\r\n background: var(--md-surface-muted);\r\n border-radius: 4px;\n}\n.overflow-x-auto[data-v-22183f86]::-webkit-scrollbar-thumb {\r\n background: var(--md-border-strong);\r\n border-radius: 4px;\n}\n.overflow-x-auto[data-v-22183f86]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.overflow-x-auto[data-v-f8677731] {\r\n max-width: 100%;\r\n -webkit-overflow-scrolling: touch;\n}\n.overflow-x-auto[data-v-f8677731]::-webkit-scrollbar {\r\n height: 6px;\n}\n.overflow-x-auto[data-v-f8677731]::-webkit-scrollbar-track {\r\n background: var(--md-surface-muted);\r\n border-radius: 4px;\n}\n.overflow-x-auto[data-v-f8677731]::-webkit-scrollbar-thumb {\r\n background: var(--md-border-strong);\r\n border-radius: 4px;\n}\n.overflow-x-auto[data-v-f8677731]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.panel-slide-enter-active[data-v-3185c8c2],\r\n.panel-slide-leave-active[data-v-3185c8c2] {\r\n transition:\r\n opacity 0.18s ease,\r\n transform 0.18s ease;\n}\n.panel-slide-enter-from[data-v-3185c8c2],\r\n.panel-slide-leave-to[data-v-3185c8c2] {\r\n opacity: 0;\r\n transform: translateX(-10px);\n}\r\n\r\n/* Filter pill fade */\n.fade-enter-active[data-v-3185c8c2],\r\n.fade-leave-active[data-v-3185c8c2] {\r\n transition:\r\n opacity 0.15s ease,\r\n transform 0.15s ease;\n}\n.fade-enter-from[data-v-3185c8c2],\r\n.fade-leave-to[data-v-3185c8c2] {\r\n opacity: 0;\r\n transform: translateY(-4px);\n}\r\n\r\n/* Smooth row list reorder/filter transitions */\n.row-list-enter-active[data-v-3185c8c2],\r\n.row-list-leave-active[data-v-3185c8c2] {\r\n transition:\r\n opacity 0.2s ease,\r\n transform 0.2s ease;\n}\n.row-list-enter-from[data-v-3185c8c2],\r\n.row-list-leave-to[data-v-3185c8c2] {\r\n opacity: 0;\r\n transform: translateY(6px);\n}\n.row-list-move[data-v-3185c8c2] {\r\n transition: transform 0.2s ease;\n}\r\n\r\n/* Scrollbar — thin, unobtrusive */\n.overflow-y-auto[data-v-3185c8c2]::-webkit-scrollbar {\r\n width: 6px;\n}\n.overflow-y-auto[data-v-3185c8c2]::-webkit-scrollbar-track {\r\n background: transparent;\n}\n.overflow-y-auto[data-v-3185c8c2]::-webkit-scrollbar-thumb {\r\n background: var(--md-border-strong);\r\n border-radius: 9999px;\n}\n.overflow-y-auto[data-v-3185c8c2]::-webkit-scrollbar-thumb:hover {\r\n background: var(--md-text-subtle);\n}\r\n\n.panel-slide-enter-active[data-v-3ec392a9],\r\n.panel-slide-leave-active[data-v-3ec392a9] {\r\n transition:\r\n opacity 0.18s ease,\r\n transform 0.18s ease;\n}\n.panel-slide-enter-from[data-v-3ec392a9],\r\n.panel-slide-leave-to[data-v-3ec392a9] {\r\n opacity: 0;\r\n transform: translateX(-10px);\n}\n.row-list-enter-active[data-v-3ec392a9],\r\n.row-list-leave-active[data-v-3ec392a9] {\r\n transition:\r\n opacity 0.2s ease,\r\n transform 0.2s ease;\n}\n.row-list-enter-from[data-v-3ec392a9],\r\n.row-list-leave-to[data-v-3ec392a9] {\r\n opacity: 0;\r\n transform: translateY(6px);\n}\n.row-list-move[data-v-3ec392a9] {\r\n transition: transform 0.2s ease;\n}\r\n\r\n/* Scrollbar — thin, unobtrusive. Matches SavedRowsPanel. */\n.overflow-y-auto[data-v-3ec392a9]::-webkit-scrollbar { width: 6px;\n}\n.overflow-y-auto[data-v-3ec392a9]::-webkit-scrollbar-track { background: transparent;\n}\n.overflow-y-auto[data-v-3ec392a9]::-webkit-scrollbar-thumb { background: var(--md-border-strong); border-radius: 9999px;\n}\n.overflow-y-auto[data-v-3ec392a9]::-webkit-scrollbar-thumb:hover { background: var(--md-text-subtle);\n}\r\n\n.md-toast__region[data-v-7583ad77] {\n position: fixed;\n top: 1rem;\n right: 1rem;\n z-index: 9999;\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n pointer-events: none;\n}\n.md-toast[data-v-7583ad77] {\n pointer-events: auto;\n display: flex;\n align-items: flex-start;\n gap: 0.625rem;\n min-width: 280px;\n max-width: 380px;\n padding: 0.75rem 0.875rem;\n font-size: 13px;\n border: 1px solid;\n border-radius: 0.75rem;\n box-shadow: 0 8px 30px rgb(0 0 0 / 0.12);\n}\n.md-toast__icon[data-v-7583ad77] { font-size: 15px; flex-shrink: 0; margin-top: 0.0625rem;\n}\n.md-toast__body[data-v-7583ad77] { flex: 1; min-width: 0;\n}\n.md-toast__summary[data-v-7583ad77] { font-weight: 500;\n}\n.md-toast__detail[data-v-7583ad77] { font-size: 12px; opacity: 0.8; margin-top: 0.125rem;\n}\n.md-toast__close[data-v-7583ad77] { flex-shrink: 0; opacity: 0.5; background: none; border: 0; cursor: pointer; color: inherit;\n}\n.md-toast__close[data-v-7583ad77]:hover { opacity: 1;\n}\n.md-toast--success[data-v-7583ad77] { background: var(--md-success-bg); border-color: var(--md-success-border); color: var(--md-success-fg);\n}\n.md-toast--info[data-v-7583ad77] { background: var(--md-info-bg); border-color: var(--md-info-border); color: var(--md-info-fg);\n}\n.md-toast--warn[data-v-7583ad77] { background: var(--md-surface)beb; border-color: var(--md-warning-border); color: var(--md-warning-fg);\n}\n.md-toast--error[data-v-7583ad77] { background: var(--md-danger-bg); border-color: var(--md-danger-border); color: var(--md-danger-fg);\n}\n.md-toast-enter-active[data-v-7583ad77], .md-toast-leave-active[data-v-7583ad77] { transition: all 0.2s ease;\n}\n.md-toast-enter-from[data-v-7583ad77], .md-toast-leave-to[data-v-7583ad77] { opacity: 0; transform: translateX(20px);\n}\n\n.md-confirm__body[data-v-43b7e283] { display: flex; align-items: flex-start; gap: 0.75rem;\n}\n.md-confirm__icon[data-v-43b7e283] { font-size: 22px; color: var(--md-warning); flex-shrink: 0; margin-top: 0.125rem;\n}\n.md-confirm__message[data-v-43b7e283] { margin: 0; font-size: 14px; line-height: 1.5; color: var(--md-text);\n}\n\r\n/* ── Orb ──────────────────────────────────────────────────────────────────── */\n.health-orb[data-v-0521087e] {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 24px;\r\n height: 24px;\r\n border-radius: 50%;\r\n border: none;\r\n background: transparent;\r\n cursor: pointer;\r\n padding: 0;\r\n outline: none;\r\n flex-shrink: 0;\n}\n.health-orb:focus-visible .orb-core[data-v-0521087e] {\r\n box-shadow: 0 0 0 3px rgba(66, 56, 158, 0.4);\n}\r\n\r\n/* Pulse rings */\n.orb-ring[data-v-0521087e] {\r\n position: absolute;\r\n border-radius: 50%;\r\n animation: orb-pulse-0521087e 2.4s ease-out infinite;\n}\n.orb-ring--outer[data-v-0521087e] {\r\n width: 22px;\r\n height: 22px;\r\n animation-delay: 0s;\n}\n.orb-ring--inner[data-v-0521087e] {\r\n width: 16px;\r\n height: 16px;\r\n animation-delay: 0.6s;\n}\r\n\r\n/* Core */\n.orb-core[data-v-0521087e] {\r\n position: relative;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 50%;\r\n transition: transform 0.15s ease, box-shadow 0.15s ease;\r\n z-index: 1;\n}\n.health-orb:hover .orb-core[data-v-0521087e],\r\n.health-orb--active .orb-core[data-v-0521087e] {\r\n transform: scale(1.15);\n}\r\n\r\n/* ── Status colours with brand accent ───────────────────────────────────────── */\n.health-orb--good .orb-ring[data-v-0521087e] {\r\n background: rgba(34, 197, 94, 0.25);\n}\n.health-orb--good .orb-core[data-v-0521087e] {\r\n background: #22c55e;\r\n box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.2), 0 0 8px rgba(34, 197, 94, 0.4);\n}\n.health-orb--warn .orb-ring[data-v-0521087e] {\r\n background: rgba(245, 158, 11, 0.28);\n}\n.health-orb--warn .orb-core[data-v-0521087e] {\r\n background: #f59e0b;\r\n box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.2), 0 0 8px rgba(245, 158, 11, 0.4);\n}\n.health-orb--bad .orb-ring[data-v-0521087e] {\r\n background: rgba(239, 68, 68, 0.28);\n}\n.health-orb--bad .orb-core[data-v-0521087e] {\r\n background: #ef4444;\r\n box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.2), 0 0 8px rgba(239, 68, 68, 0.4);\n}\n@keyframes orb-pulse-0521087e {\n0% { transform: scale(0.6); opacity: 0.7;\n}\n60% { transform: scale(1.6); opacity: 0;\n}\n100% { transform: scale(1.6); opacity: 0;\n}\n}\r\n\r\n/* ── Panel ────────────────────────────────────────────────────────────────── */\n.health-panel[data-v-0521087e] {\r\n position: absolute;\r\n top: calc(100% + 10px);\r\n left: 50%;\r\n transform: translateX(-50%);\r\n width: 300px;\r\n background: #18181b;\r\n border: 1px solid rgba(255, 255, 255, 0.08);\r\n border-radius: 14px;\r\n padding: 12px;\r\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 4px 12px rgba(0, 0, 0, 0.3);\r\n z-index: 9999;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n /* Smooth horizontal expansion */\r\n transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.health-panel--expanded[data-v-0521087e] {\r\n width: 400px;\n}\r\n\r\n/* When expanded, stat grid uses 3 cols instead of 2 */\n.health-panel--expanded .detail-stats[data-v-0521087e] {\r\n grid-template-columns: repeat(3, 1fr);\n}\r\n\r\n/* When expanded, accessibility list gets more vertical room */\n.health-panel--expanded .a11y-list[data-v-0521087e] {\r\n max-height: 320px;\n}\r\n\r\n/* When expanded, format rows go side-by-side */\n.health-panel--expanded .format-note[data-v-0521087e] {\r\n display: grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 6px;\n}\n.health-panel--expanded .format-row[data-v-0521087e] {\r\n flex-direction: column;\r\n align-items: flex-start;\r\n gap: 4px;\n}\r\n\r\n/* ── Panel header with brand color ─────────────────────────────────────────── */\n.panel-header[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 0 2px 4px;\r\n border-bottom: 1px solid rgba(255, 255, 255, 0.06);\n}\n.panel-header-right[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\n}\r\n\r\n/* Expand toggle button */\n.panel-expand-btn[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 22px;\r\n height: 22px;\r\n border-radius: 6px;\r\n border: 1px solid rgba(255, 255, 255, 0.08);\r\n background: rgba(255, 255, 255, 0.04);\r\n color: rgba(255, 255, 255, 0.35);\r\n cursor: pointer;\r\n transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;\r\n flex-shrink: 0;\r\n padding: 0;\n}\n.panel-expand-btn[data-v-0521087e]:hover {\r\n background: rgba(66, 56, 158, 0.18);\r\n border-color: rgba(66, 56, 158, 0.4);\r\n color: #a5b4fc;\n}\n.panel-expand-btn[data-v-0521087e]:focus-visible {\r\n outline: 2px solid rgba(66, 56, 158, 0.5);\r\n outline-offset: 1px;\n}\n.panel-expand-btn--active[data-v-0521087e] {\r\n background: rgba(66, 56, 158, 0.2);\r\n border-color: rgba(66, 56, 158, 0.45);\r\n color: #a5b4fc;\n}\n.panel-title[data-v-0521087e] {\r\n font-size: 11px;\r\n font-weight: 600;\r\n letter-spacing: 0.06em;\r\n text-transform: uppercase;\r\n color: #a5b4fc;\n}\n.panel-status-badge[data-v-0521087e] {\r\n font-size: 10px;\r\n font-weight: 600;\r\n padding: 2px 8px;\r\n border-radius: 99px;\n}\n.status-badge--good[data-v-0521087e] { background: rgba(34, 197, 94, 0.15); color: #4ade80;\n}\n.status-badge--warn[data-v-0521087e] { background: rgba(245, 158, 11, 0.15); color: #fbbf24;\n}\n.status-badge--bad[data-v-0521087e] { background: rgba(239, 68, 68, 0.15); color: #f87171;\n}\r\n\r\n/* ── Metric cards ─────────────────────────────────────────────────────────── */\n.metric-card[data-v-0521087e] {\r\n border-radius: 10px;\r\n border: 1px solid rgba(255, 255, 255, 0.06);\r\n background: rgba(255, 255, 255, 0.04);\r\n cursor: pointer;\r\n transition: background 0.15s ease, border-color 0.15s ease;\r\n overflow: hidden;\r\n user-select: none;\n}\n.metric-card[data-v-0521087e]:hover {\r\n background: rgba(66, 56, 158, 0.1);\r\n border-color: rgba(66, 56, 158, 0.3);\n}\n.metric-card[data-v-0521087e]:focus-visible {\r\n outline: 2px solid rgba(66, 56, 158, 0.5);\r\n outline-offset: 2px;\n}\n.metric-card--good[data-v-0521087e] { border-color: rgba(34, 197, 94, 0.15);\n}\n.metric-card--warn[data-v-0521087e] { border-color: rgba(245, 158, 11, 0.15);\n}\n.metric-card--bad[data-v-0521087e] { border-color: rgba(239, 68, 68, 0.2);\n}\n.metric-card--good.metric-card--expanded[data-v-0521087e] { background: rgba(34, 197, 94, 0.05);\n}\n.metric-card--warn.metric-card--expanded[data-v-0521087e] { background: rgba(245, 158, 11, 0.05);\n}\n.metric-card--bad.metric-card--expanded[data-v-0521087e] { background: rgba(239, 68, 68, 0.06);\n}\r\n\r\n/* ── Summary row ──────────────────────────────────────────────────────────── */\n.metric-summary[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 9px 10px;\r\n gap: 8px;\n}\n.metric-left[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n gap: 7px;\r\n min-width: 0;\n}\n.metric-icon[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n opacity: 0.8;\r\n flex-shrink: 0;\n}\n.metric-label[data-v-0521087e] {\r\n font-size: 11.5px;\r\n font-weight: 500;\r\n color: rgba(255, 255, 255, 0.7);\r\n white-space: nowrap;\n}\n.metric-right[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\r\n flex-shrink: 0;\n}\r\n\r\n/* Mini bar */\n.mini-bar[data-v-0521087e] {\r\n width: 36px;\r\n height: 4px;\r\n border-radius: 99px;\r\n background: rgba(255, 255, 255, 0.1);\r\n overflow: hidden;\n}\n.mini-bar-fill[data-v-0521087e] {\r\n height: 100%;\r\n border-radius: 99px;\r\n transition: width 0.5s ease;\n}\n.mini-bar-fill--good[data-v-0521087e] { background: #22c55e;\n}\n.mini-bar-fill--warn[data-v-0521087e] { background: #f59e0b;\n}\n.mini-bar-fill--bad[data-v-0521087e] { background: #ef4444;\n}\r\n\r\n/* Status dot */\n.status-dot[data-v-0521087e] {\r\n width: 6px;\r\n height: 6px;\r\n border-radius: 50%;\r\n flex-shrink: 0;\n}\n.status-dot--good[data-v-0521087e] { background: #22c55e;\n}\n.status-dot--warn[data-v-0521087e] { background: #f59e0b;\n}\n.status-dot--bad[data-v-0521087e] { background: #ef4444;\n}\r\n\r\n/* Pulsing dot for bad status */\n.pulse-dot[data-v-0521087e] {\r\n position: relative;\r\n width: 6px;\r\n height: 6px;\r\n flex-shrink: 0;\n}\n.pulse-dot[data-v-0521087e]::before,\r\n.pulse-dot[data-v-0521087e]::after {\r\n content: '';\r\n position: absolute;\r\n inset: 0;\r\n border-radius: 50%;\n}\n.pulse-dot--bad[data-v-0521087e]::before { background: #ef4444; z-index: 1;\n}\n.pulse-dot--bad[data-v-0521087e]::after { background: #ef4444; animation: dot-ping-0521087e 1.5s ease-out infinite;\n}\n@keyframes dot-ping-0521087e {\n0% { transform: scale(1); opacity: 0.75;\n}\n100% { transform: scale(2.5); opacity: 0;\n}\n}\n.metric-value[data-v-0521087e] {\r\n font-size: 11.5px;\r\n font-weight: 600;\r\n font-variant-numeric: tabular-nums;\n}\n.metric-value--good[data-v-0521087e] { color: #4ade80;\n}\n.metric-value--warn[data-v-0521087e] { color: #fbbf24;\n}\n.metric-value--bad[data-v-0521087e] { color: #f87171;\n}\r\n\r\n/* Chevron */\n.chevron[data-v-0521087e] {\r\n color: rgba(255, 255, 255, 0.3);\r\n transition: transform 0.2s ease, color 0.15s ease;\r\n flex-shrink: 0;\n}\n.chevron--open[data-v-0521087e] { transform: rotate(180deg); color: rgba(255, 255, 255, 0.6);\n}\n.metric-card:hover .chevron[data-v-0521087e] { color: rgba(255, 255, 255, 0.5);\n}\r\n\r\n/* ── Expanded detail ──────────────────────────────────────────────────────── */\n.metric-detail[data-v-0521087e] {\r\n padding: 0 10px 10px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n border-top: 1px solid rgba(255, 255, 255, 0.05);\n}\n.detail-tip[data-v-0521087e] {\r\n font-size: 11px;\r\n line-height: 1.55;\r\n color: rgba(255, 255, 255, 0.55);\r\n margin: 6px 0 0;\n}\r\n\r\n/* Stats grid */\n.detail-stats[data-v-0521087e] {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 4px 12px;\n}\n.stat-item[data-v-0521087e] {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: baseline;\r\n gap: 6px;\n}\n.stat-label[data-v-0521087e] {\r\n font-size: 10.5px;\r\n color: rgba(255, 255, 255, 0.35);\r\n white-space: nowrap;\n}\n.stat-value[data-v-0521087e] {\r\n font-size: 11px;\r\n font-weight: 600;\r\n color: rgba(255, 255, 255, 0.75);\r\n font-variant-numeric: tabular-nums;\n}\r\n\r\n/* Thresholds */\n.detail-thresholds[data-v-0521087e] {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 4px;\r\n padding-top: 4px;\r\n border-top: 1px solid rgba(255, 255, 255, 0.05);\n}\n.threshold[data-v-0521087e] {\r\n font-size: 10px;\r\n font-weight: 500;\r\n padding: 2px 7px;\r\n border-radius: 99px;\n}\n.threshold--good[data-v-0521087e] { background: rgba(34, 197, 94, 0.12); color: #4ade80;\n}\n.threshold--warn[data-v-0521087e] { background: rgba(245, 158, 11, 0.12); color: #fbbf24;\n}\n.threshold--bad[data-v-0521087e] { background: rgba(239, 68, 68, 0.12); color: #f87171;\n}\r\n\r\n/* ── Format note (KB card) ────────────────────────────────────────────────── */\n.format-note[data-v-0521087e] {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 5px;\r\n background: rgba(0, 0, 0, 0.2);\r\n border-radius: 8px;\r\n padding: 8px;\n}\n.format-row[data-v-0521087e] {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 8px;\n}\n.format-badge[data-v-0521087e] {\r\n font-size: 9.5px;\r\n font-weight: 700;\r\n letter-spacing: 0.05em;\r\n padding: 2px 6px;\r\n border-radius: 4px;\r\n flex-shrink: 0;\r\n margin-top: 1px;\r\n background: rgba(66, 56, 158, 0.3);\r\n color: #a5b4fc;\n}\n.format-badge--muted[data-v-0521087e] {\r\n background: rgba(255, 255, 255, 0.07);\r\n color: rgba(255, 255, 255, 0.35);\n}\n.format-info[data-v-0521087e] {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 2px;\r\n min-width: 0;\n}\n.format-range[data-v-0521087e] {\r\n font-size: 11px;\r\n font-weight: 600;\r\n color: rgba(255, 255, 255, 0.8);\n}\n.format-range--muted[data-v-0521087e] {\r\n color: rgba(255, 255, 255, 0.35);\r\n font-weight: 500;\n}\n.format-caveat[data-v-0521087e] {\r\n font-size: 10px;\r\n line-height: 1.4;\r\n color: rgba(255, 255, 255, 0.35);\n}\r\n\r\n/* ── Accessibility card ───────────────────────────────────────────────────── */\n.a11y-detail[data-v-0521087e] {\r\n cursor: default;\r\n padding: 8px 10px 10px;\r\n gap: 10px;\n}\r\n\r\n/* Tabs */\n.a11y-tabs[data-v-0521087e] {\r\n display: grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 4px;\r\n background: rgba(0, 0, 0, 0.25);\r\n padding: 3px;\r\n border-radius: 8px;\n}\n.a11y-tab[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 6px;\r\n padding: 6px 4px;\r\n background: transparent;\r\n border: none;\r\n border-radius: 6px;\r\n cursor: pointer;\r\n font-family: inherit;\r\n font-size: 10.5px;\r\n font-weight: 600;\r\n letter-spacing: 0.02em;\r\n color: rgba(255, 255, 255, 0.45);\r\n transition: background 0.15s ease, color 0.15s ease;\n}\n.a11y-tab[data-v-0521087e]:hover {\r\n color: rgba(255, 255, 255, 0.75);\r\n background: rgba(255, 255, 255, 0.04);\n}\n.a11y-tab[data-v-0521087e]:focus-visible {\r\n outline: 2px solid rgba(66, 56, 158, 0.5);\r\n outline-offset: 1px;\n}\n.a11y-tab--active[data-v-0521087e] {\r\n background: rgba(255, 255, 255, 0.07);\r\n color: rgba(255, 255, 255, 0.92);\n}\n.a11y-tab-label[data-v-0521087e] {\r\n text-transform: uppercase;\n}\n.a11y-tab-count[data-v-0521087e] {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n min-width: 18px;\r\n height: 16px;\r\n padding: 0 5px;\r\n border-radius: 99px;\r\n font-size: 10px;\r\n font-weight: 700;\r\n font-variant-numeric: tabular-nums;\r\n line-height: 1;\n}\n.a11y-tab-count--failed[data-v-0521087e] { background: rgba(239, 68, 68, 0.18); color: #f87171;\n}\n.a11y-tab-count--passed[data-v-0521087e] { background: rgba(34, 197, 94, 0.18); color: #4ade80;\n}\n.a11y-tab-count--ignored[data-v-0521087e] { background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.5);\n}\r\n\r\n/* List */\n.a11y-list[data-v-0521087e] {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 6px;\r\n max-height: 240px;\r\n overflow-y: auto;\r\n /* Custom thin scrollbar */\r\n scrollbar-width: thin;\r\n scrollbar-color: rgba(255, 255, 255, 0.12) transparent;\n}\n.a11y-list[data-v-0521087e]::-webkit-scrollbar {\r\n width: 6px;\n}\n.a11y-list[data-v-0521087e]::-webkit-scrollbar-track {\r\n background: transparent;\n}\n.a11y-list[data-v-0521087e]::-webkit-scrollbar-thumb {\r\n background: rgba(255, 255, 255, 0.12);\r\n border-radius: 99px;\n}\n.a11y-empty[data-v-0521087e] {\r\n font-size: 11px;\r\n color: rgba(255, 255, 255, 0.4);\r\n text-align: center;\r\n padding: 12px 4px;\r\n margin: 0;\n}\n.a11y-item[data-v-0521087e] {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n padding: 8px;\r\n border-radius: 8px;\r\n background: rgba(255, 255, 255, 0.03);\r\n border-left: 2px solid transparent;\n}\n.a11y-item--critical[data-v-0521087e] { border-left-color: #ef4444;\n}\n.a11y-item--serious[data-v-0521087e] { border-left-color: #f59e0b;\n}\n.a11y-item--passed[data-v-0521087e] { border-left-color: rgba(34, 197, 94, 0.5);\n}\n.a11y-item--ignored[data-v-0521087e] { border-left-color: rgba(255, 255, 255, 0.18); opacity: 0.75;\n}\n.a11y-item-header[data-v-0521087e] {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\n}\n.a11y-severity[data-v-0521087e] {\r\n display: inline-flex;\r\n align-items: center;\r\n font-size: 9px;\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n letter-spacing: 0.05em;\r\n padding: 2px 6px;\r\n border-radius: 4px;\r\n flex-shrink: 0;\n}\n.a11y-severity--critical[data-v-0521087e] { background: rgba(239, 68, 68, 0.18); color: #f87171;\n}\n.a11y-severity--serious[data-v-0521087e] { background: rgba(245, 158, 11, 0.18); color: #fbbf24;\n}\n.a11y-severity--passed[data-v-0521087e] { background: rgba(34, 197, 94, 0.18); color: #4ade80;\n}\n.a11y-severity--ignored[data-v-0521087e] { background: rgba(255, 255, 255, 0.07); color: rgba(255, 255, 255, 0.5);\n}\n.a11y-rule[data-v-0521087e] {\r\n font-size: 11px;\r\n font-weight: 600;\r\n color: rgba(255, 255, 255, 0.85);\r\n flex: 1;\r\n min-width: 0;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\n}\n.a11y-action[data-v-0521087e] {\r\n background: transparent;\r\n border: 1px solid rgba(255, 255, 255, 0.1);\r\n border-radius: 4px;\r\n padding: 2px 7px;\r\n font-family: inherit;\r\n font-size: 9.5px;\r\n font-weight: 600;\r\n color: rgba(255, 255, 255, 0.5);\r\n cursor: pointer;\r\n transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;\r\n flex-shrink: 0;\n}\n.a11y-action[data-v-0521087e]:hover {\r\n background: rgba(255, 255, 255, 0.06);\r\n color: rgba(255, 255, 255, 0.85);\r\n border-color: rgba(255, 255, 255, 0.2);\n}\n.a11y-action[data-v-0521087e]:focus-visible {\r\n outline: 2px solid rgba(66, 56, 158, 0.5);\r\n outline-offset: 1px;\n}\n.a11y-action--restore[data-v-0521087e] {\r\n border-color: rgba(165, 180, 252, 0.25);\r\n color: #a5b4fc;\n}\n.a11y-action--restore[data-v-0521087e]:hover {\r\n background: rgba(66, 56, 158, 0.15);\r\n border-color: rgba(165, 180, 252, 0.4);\r\n color: #c7d2fe;\n}\n.a11y-message[data-v-0521087e] {\r\n font-size: 10.5px;\r\n line-height: 1.5;\r\n color: rgba(255, 255, 255, 0.65);\r\n margin: 0;\n}\n.a11y-info[data-v-0521087e] {\r\n font-size: 10px;\r\n line-height: 1.5;\r\n color: rgba(255, 255, 255, 0.38);\r\n margin: 0;\r\n padding-top: 2px;\r\n border-top: 1px dashed rgba(255, 255, 255, 0.06);\n}\r\n\r\n/* ── Panel footer ─────────────────────────────────────────────────────────── */\n.panel-footer[data-v-0521087e] {\r\n font-size: 10px;\r\n color: rgba(255, 255, 255, 0.22);\r\n text-align: center;\r\n padding-top: 4px;\r\n margin: 0;\n}\r\n\r\n/* ── Click-outside overlay ────────────────────────────────────────────────── */\n.click-outside[data-v-0521087e] {\r\n position: fixed;\r\n inset: 0;\r\n z-index: 9998;\n}\r\n\r\n/* ── Transitions ──────────────────────────────────────────────────────────── */\n.popover-enter-active[data-v-0521087e] {\r\n transition: opacity 0.18s ease, transform 0.18s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n.popover-leave-active[data-v-0521087e] {\r\n transition: opacity 0.12s ease, transform 0.12s ease;\n}\n.popover-enter-from[data-v-0521087e] {\r\n opacity: 0;\r\n transform: translateX(-50%) translateY(-6px) scale(0.97);\n}\n.popover-leave-to[data-v-0521087e] {\r\n opacity: 0;\r\n transform: translateX(-50%) translateY(-4px) scale(0.98);\n}\n.expand-enter-active[data-v-0521087e] {\r\n transition: opacity 0.18s ease, max-height 0.22s ease;\r\n max-height: 300px;\r\n overflow: hidden;\n}\n.expand-leave-active[data-v-0521087e] {\r\n transition: opacity 0.12s ease, max-height 0.18s ease;\r\n overflow: hidden;\n}\n.expand-enter-from[data-v-0521087e] {\r\n opacity: 0;\r\n max-height: 0;\n}\n.expand-leave-to[data-v-0521087e] {\r\n opacity: 0;\r\n max-height: 0;\n}\r\n\n.picker-overlay-enter-active[data-v-5f1ee4c3],\r\n.picker-overlay-leave-active[data-v-5f1ee4c3] {\r\n transition: opacity 0.2s ease;\n}\n.picker-overlay-enter-from[data-v-5f1ee4c3],\r\n.picker-overlay-leave-to[data-v-5f1ee4c3] {\r\n opacity: 0;\n}\n.picker-drawer-enter-active[data-v-5f1ee4c3],\r\n.picker-drawer-leave-active[data-v-5f1ee4c3] {\r\n transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);\n}\n.picker-drawer-enter-from[data-v-5f1ee4c3],\r\n.picker-drawer-leave-to[data-v-5f1ee4c3] {\r\n transform: translateX(100%);\n}\r\n\n.note-enter-active[data-v-b07bbf33],\r\n.note-leave-active[data-v-b07bbf33] {\r\n transition:\r\n opacity 0.2s ease,\r\n max-height 0.25s ease;\r\n max-height: 60px;\r\n overflow: hidden;\n}\n.note-enter-from[data-v-b07bbf33],\r\n.note-leave-to[data-v-b07bbf33] {\r\n opacity: 0;\r\n max-height: 0;\n}\r\n\n.md-msg[data-v-db5ba171] {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n padding: 0.625rem 0.75rem;\n font-size: 13px;\n border: 1px solid;\n border-radius: 0.5rem;\n}\n.md-msg__icon[data-v-db5ba171] { margin-top: 0.125rem; flex-shrink: 0; font-size: 14px;\n}\n.md-msg__body[data-v-db5ba171] { flex: 1; min-width: 0;\n}\n.md-msg__close[data-v-db5ba171] { opacity: 0.6; cursor: pointer; background: none; border: 0;\n}\n.md-msg__close[data-v-db5ba171]:hover { opacity: 1;\n}\n.md-msg--info[data-v-db5ba171] { background: var(--md-info-bg); border-color: var(--md-info-border); color: var(--md-info-fg);\n}\n.md-msg--success[data-v-db5ba171] { background: var(--md-success-bg); border-color: var(--md-success-border); color: var(--md-success-fg);\n}\n.md-msg--warn[data-v-db5ba171] { background: var(--md-surface)beb; border-color: var(--md-warning-border); color: var(--md-warning-fg);\n}\n.md-msg--error[data-v-db5ba171] { background: var(--md-danger-bg); border-color: var(--md-danger-border); color: var(--md-danger-fg);\n}\n\r\n/* Auto-save pill: fade + 4px vertical drift on enter/leave */\n.autosave-fade-enter-active[data-v-8a0c6ca5],\r\n.autosave-fade-leave-active[data-v-8a0c6ca5] {\r\n transition:\r\n opacity 0.2s ease,\r\n transform 0.2s ease;\n}\n.autosave-fade-enter-from[data-v-8a0c6ca5] {\r\n opacity: 0;\r\n transform: translateY(4px);\n}\n.autosave-fade-leave-to[data-v-8a0c6ca5] {\r\n opacity: 0;\r\n transform: translateY(-4px);\n}\r\n/*$vite$:1*/";
|
|
7232
7232
|
return raw.startsWith("__MAILDENO_EXTRACTED") ? "" : raw;
|
|
7233
7233
|
}
|
|
7234
7234
|
/**
|
|
@@ -52956,10 +52956,10 @@ var DesktopOnlyNotice_default = /*#__PURE__*/ _plugin_vue_export_helper_default(
|
|
|
52956
52956
|
setup(__props) {
|
|
52957
52957
|
const { isDesktop } = useDeviceDetection();
|
|
52958
52958
|
return (_ctx, _cache) => {
|
|
52959
|
-
return !unref(isDesktop) ? (openBlock(), createElementBlock("div", _hoisted_1$49, [createBaseVNode("div", _hoisted_2$43, [_cache[1] || (_cache[1] = createStaticVNode("<div class=\"brand-badge\" data-v-
|
|
52959
|
+
return !unref(isDesktop) ? (openBlock(), createElementBlock("div", _hoisted_1$49, [createBaseVNode("div", _hoisted_2$43, [_cache[1] || (_cache[1] = createStaticVNode("<div class=\"brand-badge\" data-v-f2e384b2><div class=\"badge-ring\" data-v-f2e384b2></div><div class=\"badge-icon\" data-v-f2e384b2><svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" data-v-f2e384b2><path d=\"M16 4L4 10V22L16 28L28 22V10L16 4Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" fill=\"none\" data-v-f2e384b2></path><path d=\"M16 16L28 10M16 16L4 10M16 16V28\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" data-v-f2e384b2></path><circle cx=\"16\" cy=\"16\" r=\"3\" fill=\"currentColor\" data-v-f2e384b2></circle></svg></div></div><div class=\"gate-content\" data-v-f2e384b2><h1 class=\"gate-title\" data-v-f2e384b2><span class=\"brand-gradient\" data-v-f2e384b2>Desktop Experience</span><span data-v-f2e384b2> Required</span></h1><p class=\"gate-description\" data-v-f2e384b2> This application is optimized for desktop and laptop devices to deliver the full experience. </p><div class=\"feature-grid\" data-v-f2e384b2><div class=\"feature-item\" data-v-f2e384b2><div class=\"feature-icon\" data-v-f2e384b2><svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" data-v-f2e384b2><rect x=\"2\" y=\"4\" width=\"16\" height=\"12\" rx=\"1\" stroke=\"currentColor\" stroke-width=\"1.2\" data-v-f2e384b2></rect><path d=\"M6 16L4 18M14 16L16 18M2 8H18\" stroke=\"currentColor\" stroke-width=\"1.2\" data-v-f2e384b2></path></svg></div><span data-v-f2e384b2>Template Builder</span></div><div class=\"feature-item\" data-v-f2e384b2><div class=\"feature-icon\" data-v-f2e384b2><svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" data-v-f2e384b2><path d=\"M3 13L7 9L10 12L17 5\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" data-v-f2e384b2></path><path d=\"M3 17H17\" stroke=\"currentColor\" stroke-width=\"1.2\" stroke-linecap=\"round\" data-v-f2e384b2></path></svg></div><span data-v-f2e384b2>Visual Debugger</span></div><div class=\"feature-item\" data-v-f2e384b2><div class=\"feature-icon\" data-v-f2e384b2><svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" data-v-f2e384b2><path d=\"M4 6L10 3L16 6L10 9L4 6Z\" stroke=\"currentColor\" stroke-width=\"1.2\" data-v-f2e384b2></path><path d=\"M4 10L10 13L16 10\" stroke=\"currentColor\" stroke-width=\"1.2\" data-v-f2e384b2></path><path d=\"M4 14L10 17L16 14\" stroke=\"currentColor\" stroke-width=\"1.2\" data-v-f2e384b2></path></svg></div><span data-v-f2e384b2>Development</span></div></div><div class=\"detection-status\" data-v-f2e384b2><span class=\"status-dot\" data-v-f2e384b2></span><span data-v-f2e384b2>Detected: Mobile / Tablet</span></div></div>", 2)), createBaseVNode("div", _hoisted_3$37, [_cache[0] || (_cache[0] = createBaseVNode("span", { class: "footer-text" }, "Powered by", -1)), createBaseVNode("span", _hoisted_4$32, toDisplayString(__props.brandName), 1)])])])) : createCommentVNode("", true);
|
|
52960
52960
|
};
|
|
52961
52961
|
}
|
|
52962
|
-
}), [["__scopeId", "data-v-
|
|
52962
|
+
}), [["__scopeId", "data-v-f2e384b2"]]);
|
|
52963
52963
|
//#endregion
|
|
52964
52964
|
//#region src/composables/ui/useToast.ts
|
|
52965
52965
|
var toasts = ref([]);
|
|
@@ -60153,7 +60153,7 @@ var RowPreviewChildren_vue_vue_type_script_setup_true_lang_default = /*@__PURE__
|
|
|
60153
60153
|
depth: {}
|
|
60154
60154
|
},
|
|
60155
60155
|
setup(__props) {
|
|
60156
|
-
const RowPreviewRow = defineAsyncComponent(() => import("./RowPreviewRow-
|
|
60156
|
+
const RowPreviewRow = defineAsyncComponent(() => import("./RowPreviewRow-D-wmhbhZ.js"));
|
|
60157
60157
|
const RowPreviewLegacyComponent = defineAsyncComponent(() => import("./RowPreviewLegacyComponent-yjHSkZLz.js"));
|
|
60158
60158
|
function resolveBackground(item) {
|
|
60159
60159
|
const bg = item?.backgroundGradient;
|