@kyro-cms/admin 0.3.2 → 0.3.5

package/dist/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/styles/main.css"],"sourcesContent":["@import \"tailwindcss\";\n@custom-variant dark (&:where(.dark, .dark *));\n\n@source \"../../src/**/*.{astro,html,js,jsx,ts,tsx}\";\n\n:root {\n  /* Monochrome Palette */\n  --kyro-black: #0b1222;\n  --kyro-black-light: #1a2332;\n  --kyro-black-hover: #2a3342;\n\n  /* Neutral Palette */\n  --kyro-gray-50: #f9fafb;\n  --kyro-gray-100: #f3f4f6;\n  --kyro-gray-200: #e5e7eb;\n  --kyro-gray-300: #d1d5db;\n  --kyro-gray-400: #9ca3af;\n  --kyro-gray-500: #6b7280;\n  --kyro-gray-600: #4b5563;\n  --kyro-gray-700: #374151;\n  --kyro-gray-800: #1f2937;\n  --kyro-gray-900: #111827;\n\n  /* Dashboard Theme */\n  --kyro-bg: #eaeff2;\n  --kyro-surface: #ffffff;\n  --kyro-surface-accent: #f9fafb;\n  --kyro-sidebar-bg: #ffffff;\n  --kyro-sidebar-active: #0b1222;\n  --kyro-sidebar-text: #64748b;\n  --kyro-sidebar-text-active: #ffffff;\n  --kyro-sidebar-border: rgba(0, 0, 0, 0.05);\n\n  /* Semantic Typography */\n  --kyro-text-primary: #0b1222;\n  --kyro-text-secondary: #64748b;\n  --kyro-text-muted: #94a3b8;\n\n  /* Semantic UI */\n  --kyro-border: #f3f4f6;\n  --kyro-input-bg: #ffffff;\n  --kyro-input-border: #e5e7eb;\n\n  /* Elevation & Radius */\n  --kyro-radius-tile: 32px;\n  --kyro-radius-lg: 16px;\n  --kyro-radius-xl: 48px;\n  --kyro-shadow-tile: 0 10px 40px -10px rgba(0, 0, 0, 0.04);\n\n  /* Primary Brand Color */\n  --kyro-primary: #0b1222;\n  --kyro-primary-hover: #1a2332;\n\n  /* Success Color */\n  --kyro-success: #22c55e;\n  --kyro-success-bg: rgba(34, 197, 94, 0.1);\n\n  /* Danger/Error Color */\n  --kyro-danger: #ef4444;\n  --kyro-danger-bg: rgba(239, 68, 68, 0.1);\n  --kyro-error: #ef4444;\n\n  /* Warning Color */\n  --kyro-warning: #ffae00;\n  --kyro-warning-bg: rgba(255, 174, 0, 0.1);\n\n  /* Border Active */\n  --kyro-border-active: #0b1222;\n\n  /* Secondary Backgrounds */\n  --kyro-bg-secondary: #f3f4f6;\n\n  /* Layout */\n  --kyro-sidebar-width: 320px;\n  --kyro-header-height: 80px;\n}\n\n:root.dark {\n  --kyro-bg: #050912;\n  --kyro-surface: #0b1222;\n  --kyro-surface-accent: #111a2e;\n  --kyro-sidebar-bg: #0b1222;\n  --kyro-sidebar-active: #ffffff;\n  --kyro-sidebar-text: #94a3b8;\n  --kyro-sidebar-text-active: #0b1222;\n  --kyro-sidebar-border: rgba(255, 255, 255, 0.05);\n\n  --kyro-text-primary: #ffffff;\n  --kyro-text-secondary: #94a3b8;\n  --kyro-text-muted: #64748b;\n\n  --kyro-border: #1a2332;\n  --kyro-input-bg: #111a2e;\n  --kyro-input-border: #1e293b;\n\n  --kyro-black: #ffffff;\n  --kyro-gray-50: #1a2332;\n  --kyro-gray-100: #1e293b;\n  --kyro-gray-200: #334155;\n\n  /* Primary Brand Color (dark) - Use sidebar accent for consistency */\n  --kyro-primary: var(--kyro-sidebar-active);\n  --kyro-primary-hover: var(--kyro-sidebar-text-active);\n\n  /* Success Color (dark) */\n  --kyro-success: #22c55e;\n  --kyro-success-bg: rgba(34, 197, 94, 0.15);\n\n  /* Danger/Error Color (dark) */\n  --kyro-danger: #f87171;\n  --kyro-danger-bg: rgba(248, 113, 113, 0.15);\n  --kyro-error: #f87171;\n\n  /* Warning Color (dark) */\n  --kyro-warning: #ffae00;\n  --kyro-warning-bg: rgba(255, 174, 0, 0.15);\n\n  /* Border Active (dark) */\n  --kyro-border-active: #ffffff;\n\n  /* Secondary Backgrounds (dark) */\n  --kyro-bg-secondary: #111a2e;\n\n  color-scheme: dark;\n}\n\n@theme {\n  --font-sans: \"Inter\", ui-sans-serif, system-ui, sans-serif;\n\n  --color-primary: var(--kyro-black);\n  --color-primary-hover: var(--kyro-black-hover);\n  --color-primary-light: var(--kyro-gray-100);\n\n  --color-gray-50: var(--kyro-gray-50);\n  --color-gray-100: var(--kyro-gray-100);\n  --color-gray-200: var(--kyro-gray-200);\n  --color-gray-400: var(--kyro-gray-400);\n  --color-gray-500: var(--kyro-gray-500);\n\n  --radius-tile: var(--kyro-radius-tile);\n  --radius-lg: var(--kyro-radius-lg);\n  --radius-xl: var(--kyro-radius-xl);\n\n  --shadow-tile: var(--kyro-shadow-tile);\n\n  /* Drawer slide animation */\n  --animate-slide-in-from-right: slide-in-from-right 200ms ease-out;\n\n  @keyframes slide-in-from-right {\n    from {\n      transform: translateX(100%);\n    }\n\n    to {\n      transform: translateX(0);\n    }\n  }\n}\n\n@layer base {\n  html {\n    font-family: var(--font-sans);\n    font-size: 14px;\n    line-height: 1.5;\n    color: var(--kyro-text-primary);\n    background: var(--kyro-bg);\n    transition:\n      background-color 300ms ease,\n      color 300ms ease;\n  }\n\n  /* Hide scrollbars on all elements (scroll still works) */\n  * {\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n\n  *::-webkit-scrollbar {\n    display: none;\n  }\n\n\n  a,\n  button,\n  [role=\"button\"],\n  input[type=\"button\"],\n  input[type=\"submit\"],\n  input[type=\"reset\"] {\n    cursor: pointer;\n  }\n\n  /* Premium Utilities */\n  .kyro-glass {\n    background: rgba(255, 255, 255, 0.7);\n    backdrop-filter: blur(20px) saturate(180%);\n    -webkit-backdrop-filter: blur(20px) saturate(180%);\n    border: 1px solid rgba(255, 255, 255, 0.3);\n  }\n\n  .dark .kyro-glass {\n    background: rgba(11, 18, 34, 0.7);\n    border: 1px solid rgba(255, 255, 255, 0.05);\n  }\n\n  .font-bold {\n    font-weight: 900;\n    letter-spacing: -0.05em;\n    line-height: 1.1;\n  }\n}\n\n\n@layer components {\n  .kyro-admin {\n    display: flex;\n    height: 100vh;\n    padding: 16px;\n    gap: 16px;\n    background: var(--kyro-bg);\n  }\n\n  /* Sidebar */\n  .kyro-sidebar {\n    width: var(--kyro-sidebar-width);\n    background: var(--kyro-sidebar-bg);\n    display: flex;\n    flex-direction: column;\n    flex-shrink: 0;\n    overflow: hidden;\n  }\n\n  .kyro-sidebar-logo {\n    height: var(--kyro-header-height);\n    display: flex;\n    align-items: center;\n    padding: 0 20px;\n    border-bottom: 1px solid var(--kyro-sidebar-border);\n  }\n\n  .kyro-sidebar-logo-text {\n    font-size: 16px;\n    font-weight: 600;\n    color: var(--kyro-sidebar-text-active);\n    letter-spacing: -0.02em;\n  }\n\n  .kyro-sidebar-nav {\n    flex: 1;\n    overflow-y: auto;\n    padding: 12px 0;\n  }\n\n  .kyro-sidebar-section {\n    margin-bottom: 8px;\n  }\n\n  .kyro-sidebar-section-title {\n    padding: 8px 20px;\n    font-size: 11px;\n    font-weight: 600;\n    text-transform: none;\n    letter-spacing: 0.05em;\n    color: var(--kyro-gray-500);\n  }\n\n  .kyro-sidebar-divider {\n    height: 1px;\n    background: var(--kyro-sidebar-border);\n    margin: 12px 20px;\n  }\n\n  .kyro-sidebar-item {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    width: 100%;\n    padding: 10px 20px;\n    font-size: 14px;\n    font-weight: 500;\n    color: var(--kyro-sidebar-text);\n    background: transparent;\n    border: none;\n    cursor: pointer;\n    transition: all 150ms ease;\n    text-align: left;\n    text-decoration: none;\n  }\n\n  .kyro-sidebar-item:hover {\n    color: var(--kyro-black);\n    background: var(--kyro-gray-50);\n  }\n\n  .kyro-sidebar-item.active {\n    color: var(--kyro-sidebar-text-active);\n    background: var(--kyro-sidebar-active);\n  }\n\n  .kyro-sidebar-item svg {\n    width: 18px;\n    height: 18px;\n    flex-shrink: 0;\n    opacity: 0.7;\n  }\n\n  .kyro-sidebar-item.active svg,\n  .kyro-sidebar-item:hover svg {\n    opacity: 1;\n  }\n\n  .kyro-sidebar-footer {\n    padding: 12px 20px;\n    border-top: 1px solid var(--kyro-sidebar-border);\n  }\n\n  .kyro-sidebar.collapsed {\n    width: 72px;\n  }\n\n  .kyro-sidebar.collapsed .kyro-sidebar-item {\n    justify-content: center;\n    padding: 12px;\n  }\n\n  .kyro-sidebar.collapsed .kyro-sidebar-item span {\n    display: none;\n  }\n\n  .kyro-sidebar.collapsed .kyro-sidebar-section-title {\n    display: none;\n  }\n\n  .kyro-sidebar.collapsed .kyro-sidebar-logo {\n    justify-content: center;\n    padding: 0;\n  }\n\n  /* Main Content */\n  .kyro-admin-main {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    pointer-events: auto;\n  }\n\n  .kyro-admin-content {\n    flex: 1;\n    overflow-y: auto;\n    padding: 24px;\n    pointer-events: auto;\n  }\n\n  /* Buttons — Monochrome */\n  .kyro-btn {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 6px;\n    font-weight: 500;\n    border-radius: 9999px;\n    cursor: pointer;\n    transition: all 150ms ease;\n    border: 1px solid transparent;\n    font-family: inherit;\n    white-space: nowrap;\n    text-decoration: none;\n  }\n\n  .kyro-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .kyro-btn-sm {\n    padding: 6px 10px;\n    font-size: 12px;\n  }\n\n  .kyro-btn-md {\n    padding: 8px 14px;\n    font-size: 13px;\n  }\n\n  .kyro-btn-lg {\n    padding: 10px 18px;\n    font-size: 14px;\n  }\n\n  .kyro-btn-primary {\n    background: var(--kyro-black);\n    color: var(--kyro-sidebar-text-active);\n    border-color: var(--kyro-black);\n  }\n\n  .kyro-btn-primary:hover:not(:disabled) {\n    background: var(--kyro-black-hover);\n    border-color: var(--kyro-black-hover);\n  }\n\n  .kyro-btn-secondary {\n    background: var(--kyro-surface);\n    color: var(--kyro-text-primary);\n    border-color: var(--kyro-border);\n  }\n\n  .kyro-btn-secondary:hover:not(:disabled) {\n    background: var(--kyro-gray-50);\n    border-color: var(--kyro-gray-300);\n  }\n\n  .kyro-btn-danger {\n    background: var(--kyro-surface);\n    color: var(--kyro-text-primary);\n    border-color: var(--kyro-text-primary);\n  }\n\n  .kyro-btn-danger:hover:not(:disabled) {\n    background: var(--kyro-gray-900);\n    color: white;\n  }\n\n  .kyro-btn-ghost {\n    background: transparent;\n    color: var(--kyro-gray-500);\n  }\n\n  .kyro-btn-ghost:hover:not(:disabled) {\n    background: var(--kyro-gray-100);\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-btn-success {\n    background: #10b981;\n    color: white;\n    border-color: #10b981;\n  }\n\n  .kyro-btn-success:hover:not(:disabled) {\n    background: #059669;\n    border-color: #059669;\n  }\n\n  .kyro-btn-success:disabled {\n    background: var(--kyro-gray-300);\n    border-color: var(--kyro-gray-300);\n    color: var(--kyro-gray-500);\n  }\n\n  .kyro-btn-warning {\n    background: #f59e0b;\n    color: white;\n    border-color: #f59e0b;\n  }\n\n  .kyro-btn-warning:hover:not(:disabled) {\n    background: #d97706;\n    border-color: #d97706;\n  }\n\n  /* Cards & Tiles */\n  .surface-tile {\n    box-shadow: var(--kyro-shadow-tile);\n    /* border: 1px solid rgba(255, 255, 255, 0.8); */\n    padding: 24px;\n    background: var(--kyro-surface);\n    border-radius: var(--kyro-radius-tile);\n  }\n\n  .kyro-card {\n    border: 1px solid var(--kyro-border);\n    box-shadow: var(--kyro-shadow-tile);\n    padding: 24px;\n    background: var(--kyro-surface);\n    border-radius: var(--kyro-radius-lg);\n  }\n\n  .kyro-card-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 24px 32px;\n  }\n\n  .kyro-card-title {\n    font-size: 24px;\n    font-weight: 700;\n    color: var(--kyro-text-primary);\n    letter-spacing: -0.01em;\n  }\n\n  .kyro-card-content {\n    padding: 0 32px 32px;\n  }\n\n  /* List View */\n  .kyro-list {\n    display: flex;\n    flex-direction: column;\n    gap: 20px;\n  }\n\n  .kyro-list-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n\n  .kyro-list-title {\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-table {\n    width: 100%;\n    border-collapse: collapse;\n    background: white;\n    border-radius: 8px;\n    overflow: hidden;\n    border: 1px solid var(--kyro-border);\n  }\n\n  .kyro-table th {\n    padding: 12px 16px;\n    font-size: 12px;\n    font-weight: 600;\n    text-transform: none;\n    letter-spacing: 0.03em;\n    color: var(--kyro-gray-500);\n    background: var(--kyro-gray-50);\n    border-bottom: 1px solid var(--kyro-border);\n    text-align: left;\n  }\n\n  .kyro-table td {\n    padding: 14px 16px;\n    border-bottom: 1px solid var(--kyro-gray-100);\n    font-size: 14px;\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-table tr:last-child td {\n    border-bottom: none;\n  }\n\n  .kyro-table tr:hover td {\n    background: var(--kyro-gray-50);\n  }\n\n  .kyro-table-actions {\n    display: flex;\n    gap: 4px;\n  }\n\n  .kyro-table-action {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    border: none;\n    background: transparent;\n    color: var(--kyro-gray-500);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 150ms ease;\n  }\n\n  .kyro-table-action:hover {\n    background: var(--kyro-gray-100);\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-table-action.danger:hover {\n    background: var(--kyro-surface-accent);\n    color: var(--kyro-black);\n  }\n\n  .kyro-empty {\n    padding: 48px 24px;\n    text-align: center;\n    color: var(--kyro-gray-500);\n  }\n\n  .kyro-empty-icon {\n    width: 40px;\n    height: 40px;\n    margin: 0 auto 12px;\n    color: var(--kyro-gray-400);\n  }\n\n  .kyro-empty-title {\n    font-size: 14px;\n    font-weight: 600;\n    color: var(--kyro-text-primary);\n    margin-bottom: 4px;\n  }\n\n  .kyro-empty-text {\n    font-size: 13px;\n    color: var(--kyro-gray-500);\n  }\n\n  /* Detail View */\n  .kyro-detail {\n    display: flex;\n    flex-direction: column;\n    gap: 20px;\n  }\n\n  .kyro-detail-header {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n  }\n\n  .kyro-detail-back {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 36px;\n    height: 36px;\n    border: 1px solid var(--kyro-border);\n    background: var(--kyro-surface);\n    color: var(--kyro-text-secondary);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 150ms ease;\n    text-decoration: none;\n  }\n\n  .kyro-detail-back:hover {\n    background: var(--kyro-gray-50);\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-detail-title {\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-detail-meta {\n    font-size: 13px;\n    color: var(--kyro-gray-500);\n    font-family: monospace;\n  }\n\n  .kyro-detail-actions {\n    margin-left: auto;\n    display: flex;\n    gap: 8px;\n  }\n\n  .kyro-detail-body {\n    display: grid;\n    grid-template-columns: 1fr 300px;\n    gap: 20px;\n  }\n\n  @media (max-width: 1024px) {\n    .kyro-detail-body {\n      grid-template-columns: 1fr;\n    }\n  }\n\n  .kyro-meta-card {\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n    height: fit-content;\n  }\n\n  .kyro-meta-item {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .kyro-meta-label {\n    font-size: 11px;\n    font-weight: 600;\n    text-transform: none;\n    letter-spacing: 0.03em;\n    color: var(--kyro-gray-500);\n  }\n\n  .kyro-meta-value {\n    font-size: 14px;\n    color: var(--kyro-text-primary);\n  }\n\n  /* Forms */\n  .kyro-form {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n  }\n\n  .kyro-form-field {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .kyro-form-label {\n    font-size: 12px;\n    font-weight: 500;\n    color: var(--kyro-text-primary);\n    display: flex;\n    align-items: center;\n    gap: 3px;\n  }\n\n  .kyro-form-label-required {\n    color: var(--kyro-gray-400);\n    font-weight: 400;\n  }\n\n  .kyro-form-input {\n    width: 100%;\n    padding: 6px 10px;\n    font-size: 13px;\n    color: var(--kyro-text-primary);\n    background: var(--kyro-input-bg);\n    border: 1px solid var(--kyro-input-border);\n    border-radius: 6px;\n    transition: all 150ms ease;\n    font-family: inherit;\n    pointer-events: auto !important;\n    position: relative;\n    z-index: 1;\n  }\n\n  .kyro-form-input:disabled {\n    pointer-events: none !important;\n    opacity: 0.5;\n  }\n\n  .kyro-form-input[disabled] {\n    pointer-events: none !important;\n    opacity: 0.5;\n  }\n\n  textarea.kyro-form-input,\n  textarea.kyro-form-textarea {\n    pointer-events: auto !important;\n    cursor: text;\n  }\n\n  input[type=\"text\"],\n  input[type=\"email\"],\n  input[type=\"password\"],\n  input[type=\"number\"],\n  input[type=\"search\"],\n  input[type=\"url\"],\n  input[type=\"tel\"],\n  select.kyro-form-input {\n    pointer-events: auto !important;\n    cursor: text;\n  }\n\n  .kyro-form-input:hover {\n    border-color: var(--kyro-gray-300);\n  }\n\n  .kyro-form-input:focus {\n    outline: none;\n    border-color: var(--kyro-black);\n    box-shadow: 0 0 0 3px var(--kyro-sidebar-border);\n  }\n\n  .kyro-form-input::placeholder {\n    color: var(--kyro-gray-400);\n  }\n\n  .kyro-form-input-error {\n    border-color: var(--kyro-gray-900) !important;\n  }\n\n  .kyro-form-textarea {\n    min-height: 100px;\n    resize: vertical;\n  }\n\n  .kyro-form-number {\n    font-variant-numeric: tabular-nums;\n  }\n\n  .kyro-form-select {\n    appearance: none;\n    background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");\n    background-repeat: no-repeat;\n    background-position: right 10px center;\n    padding-right: 36px;\n  }\n\n  .kyro-form-checkbox {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    cursor: pointer;\n  }\n\n  .kyro-form-checkbox input {\n    width: 16px;\n    height: 16px;\n    accent-color: var(--kyro-black);\n  }\n\n  .kyro-form-checkbox-label {\n    font-size: 14px;\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-form-radio-group {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .kyro-form-radio {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    cursor: pointer;\n    font-size: 14px;\n    color: var(--kyro-gray-700);\n  }\n\n  .kyro-form-radio input {\n    accent-color: var(--kyro-black);\n  }\n\n  .kyro-form-row {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 16px;\n  }\n\n  .kyro-form-group {\n    border: 1px solid var(--kyro-border);\n    border-radius: 8px;\n    overflow: hidden;\n  }\n\n  .kyro-form-group-header {\n    padding: 12px 16px;\n    background: var(--kyro-surface-accent);\n    border-bottom: 1px solid var(--kyro-border);\n  }\n\n  .kyro-form-group-title {\n    font-size: 13px;\n    font-weight: 600;\n    color: var(--kyro-text-primary);\n    padding: 12px 16px;\n    background: var(--kyro-surface-accent);\n    border-bottom: 1px solid var(--kyro-border);\n  }\n\n  .kyro-form-group-fields {\n    padding: 16px;\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .kyro-form-group-content {\n    padding: 16px;\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .kyro-form-error {\n    font-size: 12px;\n    color: var(--kyro-gray-600);\n    font-style: italic;\n  }\n\n  .kyro-form-help {\n    font-size: 12px;\n    color: var(--kyro-gray-500);\n  }\n\n  .kyro-form-unsupported {\n    font-size: 12px;\n    color: var(--kyro-gray-400);\n    font-style: italic;\n  }\n\n  /* Color field */\n  .kyro-form-color-wrapper {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n  }\n\n  .kyro-form-color {\n    width: 42px;\n    height: 42px;\n    border: 1px solid var(--kyro-border);\n    border-radius: 6px;\n    cursor: pointer;\n    padding: 2px;\n  }\n\n  .kyro-form-color-value {\n    font-size: 13px;\n    font-family: monospace;\n    color: var(--kyro-gray-600);\n  }\n\n  /* Richtext placeholder */\n  .kyro-form-richtext {\n    min-height: 200px;\n    font-family: inherit;\n  }\n\n  .kyro-form-code {\n    font-family: \"SF Mono\", \"Fira Code\", monospace;\n    font-size: 13px;\n    tab-size: 2;\n  }\n\n  /* Relationship field */\n  .kyro-form-relationship {\n    border: 1px solid var(--kyro-border);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 150ms ease;\n  }\n\n  .kyro-form-relationship:hover {\n    border-color: var(--kyro-gray-300);\n  }\n\n  .kyro-form-relationship-header {\n    padding: 8px 12px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    background: var(--kyro-surface-accent);\n    border-bottom: 1px solid var(--kyro-border);\n    border-radius: 5px 5px 0 0;\n  }\n\n  .kyro-form-relationship-type {\n    font-size: 11px;\n    font-weight: 600;\n    color: var(--kyro-gray-500);\n    text-transform: none;\n    letter-spacing: 0.03em;\n  }\n\n  .kyro-form-relationship-badge {\n    font-size: 10px;\n    padding: 2px 6px;\n    background: var(--kyro-gray-100);\n    color: var(--kyro-text-secondary);\n    border-radius: 3px;\n    font-weight: 600;\n  }\n\n  .kyro-form-relationship-value {\n    padding: 10px 12px;\n    font-size: 14px;\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-form-relationship-empty {\n    padding: 10px 12px;\n    font-size: 14px;\n    color: var(--kyro-gray-400);\n  }\n\n  /* Array field - more compact */\n  .kyro-form-array {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n  }\n\n  .kyro-form-array-empty {\n    padding: 12px;\n    text-align: center;\n    background: var(--kyro-surface);\n    border: 2px dashed var(--kyro-border);\n    border-radius: 6px;\n    color: var(--kyro-text-muted);\n    font-size: 12px;\n  }\n\n  .kyro-form-array-item {\n    background: var(--kyro-surface);\n    border: 1px solid var(--kyro-border);\n    border-radius: 6px;\n    overflow: hidden;\n    padding: 6px;\n  }\n\n  .kyro-form-array-item-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 4px 6px;\n    background: var(--kyro-surface-accent);\n    border-bottom: 1px solid var(--kyro-border);\n  }\n\n  .kyro-form-array-item-number {\n    font-size: 10px;\n    font-weight: 600;\n    color: var(--kyro-gray-500);\n    background: var(--kyro-surface);\n    padding: 1px 4px;\n    border-radius: 3px;\n  }\n\n  .kyro-form-array-item-remove {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 18px;\n    height: 18px;\n    border: none;\n    background: transparent;\n    color: var(--kyro-gray-400);\n    cursor: pointer;\n    border-radius: 3px;\n    transition: all 150ms ease;\n  }\n\n  .kyro-form-array-item-remove:hover {\n    background: #fee2e2;\n    color: #dc2626;\n  }\n\n  .kyro-form-array-item-fields {\n    padding: 6px;\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n  }\n\n  /* Make sub-field labels more compact in arrays */\n  .kyro-form-array-item-fields .kyro-form-label {\n    font-size: 10px;\n    margin-bottom: 1px;\n  }\n\n  .kyro-form-array-item-fields .kyro-form-input {\n    padding: 4px 6px;\n    font-size: 11px;\n  }\n\n  /* Array item add button */\n  .kyro-form-array-add {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 6px 10px;\n    font-size: 11px;\n    font-weight: 600;\n    color: var(--kyro-text-secondary);\n    background: var(--kyro-surface-accent);\n    border: 1px dashed var(--kyro-border);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 150ms ease;\n  }\n\n  .kyro-form-array-add:hover {\n    background: var(--kyro-surface);\n    border-color: var(--kyro-sidebar-active);\n    color: var(--kyro-sidebar-active);\n  }\n\n  /* Blocks field */\n  .kyro-form-blocks {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n  }\n\n  .kyro-form-blocks-empty {\n    padding: 32px;\n    text-align: center;\n    background: var(--kyro-surface);\n    border: 2px dashed var(--kyro-border);\n    border-radius: 8px;\n    color: var(--kyro-text-muted);\n    font-size: 13px;\n  }\n\n  .kyro-form-block-item {\n    background: var(--kyro-surface);\n    border: 1px solid var(--kyro-border);\n    border-radius: 8px;\n    overflow: hidden;\n    padding: 10px;\n  }\n\n  .kyro-form-block-item-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 12px;\n    background: var(--kyro-surface-accent);\n    border-bottom: 1px solid var(--kyro-border);\n  }\n\n  .kyro-form-block-item-type {\n    font-size: 12px;\n    font-weight: 600;\n    color: var(--kyro-gray-700);\n  }\n\n  .kyro-form-block-item-actions {\n    display: flex;\n    gap: 4px;\n  }\n\n  .kyro-form-block-item-move,\n  .kyro-form-block-item-remove {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 24px;\n    height: 24px;\n    border: none;\n    background: transparent;\n    color: var(--kyro-gray-400);\n    cursor: pointer;\n    border-radius: 4px;\n    transition: all 150ms ease;\n  }\n\n  .kyro-form-block-item-move:hover,\n  .kyro-form-block-item-remove:hover {\n    background: var(--kyro-surface-accent);\n    color: var(--kyro-black);\n  }\n\n  .kyro-form-block-item-fields {\n    padding: 16px;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n  }\n\n  .kyro-form-blocks-add {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding-top: 8px;\n  }\n\n  .kyro-form-blocks-add-label {\n    font-size: 12px;\n    font-weight: 500;\n    color: var(--kyro-gray-500);\n  }\n\n  .kyro-form-blocks-add-buttons {\n    display: flex;\n    gap: 6px;\n    flex-wrap: wrap;\n  }\n\n  /* Tabs */\n  .kyro-form-tabs {\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .kyro-form-tab {\n    border: 1px solid var(--kyro-border);\n    border-radius: 8px;\n    overflow: hidden;\n  }\n\n  .kyro-form-tab-title {\n    font-size: 13px;\n    font-weight: 600;\n    color: var(--kyro-text-primary);\n    padding: 10px 16px;\n    background: var(--kyro-surface-accent);\n    border-bottom: 1px solid var(--kyro-border);\n    margin: 0;\n  }\n\n  .kyro-form-tab-content {\n    padding: 16px;\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  /* Collapsible */\n  .kyro-form-collapsible {\n    border: 1px solid var(--kyro-border);\n    border-radius: 8px;\n    overflow: hidden;\n  }\n\n  .kyro-form-collapsible-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    width: 100%;\n    padding: 12px 16px;\n    background: var(--kyro-surface-accent);\n    font-size: 13px;\n    font-weight: 600;\n    color: var(--kyro-text-primary);\n    border: none;\n    cursor: pointer;\n    text-align: left;\n    list-style: none;\n  }\n\n  .kyro-form-collapsible-header::-webkit-details-marker {\n    display: none;\n  }\n\n  .kyro-form-collapsible-header svg {\n    color: var(--kyro-gray-500);\n    transition: transform 150ms ease;\n  }\n\n  .kyro-form-collapsible[open] .kyro-form-collapsible-header svg {\n    transform: rotate(90deg);\n  }\n\n  .kyro-form-collapsible-content {\n    padding: 16px;\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  /* Upload */\n  .kyro-form-upload {\n    border: 2px dashed var(--kyro-border);\n    border-radius: 8px;\n    padding: 32px;\n    text-align: center;\n    cursor: pointer;\n    transition: all 150ms ease;\n    background: var(--kyro-surface);\n  }\n\n  .kyro-form-upload:hover,\n  .kyro-form-upload-dragging {\n    border-color: var(--kyro-black);\n    background: var(--kyro-surface-accent);\n  }\n\n  .kyro-form-upload-error {\n    border-color: var(--kyro-black);\n  }\n\n  .kyro-form-upload-input {\n    display: none;\n  }\n\n  .kyro-form-upload-placeholder {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n    color: var(--kyro-gray-500);\n    font-size: 14px;\n  }\n\n  .kyro-form-upload-placeholder svg {\n    color: var(--kyro-gray-400);\n  }\n\n  .kyro-form-upload-hint {\n    font-size: 12px;\n    color: var(--kyro-gray-400);\n  }\n\n  .kyro-form-upload-preview {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n  }\n\n  .kyro-form-upload-image {\n    width: 64px;\n    height: 64px;\n    border-radius: 6px;\n    object-fit: cover;\n    border: 1px solid var(--kyro-border);\n  }\n\n  .kyro-form-upload-info {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    text-align: left;\n  }\n\n  .kyro-form-upload-filename {\n    font-size: 13px;\n    font-weight: 500;\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-form-upload-change {\n    font-size: 12px;\n    color: var(--kyro-gray-500);\n    background: none;\n    border: none;\n    padding: 0;\n    cursor: pointer;\n    text-decoration: underline;\n  }\n\n  .kyro-form-upload-change:hover {\n    color: var(--kyro-black);\n  }\n\n  /* Badges — Monochrome */\n  .kyro-badge {\n    display: inline-flex;\n    align-items: center;\n    padding: 2px 8px;\n    font-size: 11px;\n    font-weight: 600;\n    border-radius: 4px;\n    text-transform: none;\n    letter-spacing: 0.02em;\n  }\n\n  .kyro-badge-default {\n    background: var(--kyro-gray-100);\n    color: var(--kyro-text-secondary);\n  }\n\n  .kyro-badge-success {\n    background: var(--kyro-gray-100);\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-badge-warning {\n    background: var(--kyro-gray-200);\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-badge-danger {\n    background: var(--kyro-gray-200);\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-badge-info {\n    background: var(--kyro-gray-100);\n    color: var(--kyro-text-secondary);\n  }\n\n  /* Toast — Glassmorphic Monochrome */\n  .kyro-toasts-container {\n    position: fixed;\n    bottom: 24px;\n    right: 24px;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n    z-index: 9999;\n    pointer-events: none;\n  }\n\n  .kyro-toast {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    min-width: 320px;\n    max-width: 420px;\n    padding: 12px;\n    background: rgba(11, 18, 34, 0.85);\n    backdrop-filter: blur(12px);\n    -webkit-backdrop-filter: blur(12px);\n    color: white;\n    border-radius: 16px;\n    border: 1px solid rgba(255, 255, 255, 0.1);\n    box-shadow: \n      0 4px 6px -1px rgba(0, 0, 0, 0.1),\n      0 20px 25px -5px rgba(0, 0, 0, 0.2);\n    pointer-events: auto;\n    overflow: hidden;\n    position: relative;\n  }\n\n  .dark .kyro-toast {\n    background: rgba(5, 9, 18, 0.9);\n    border: 1px solid rgba(255, 255, 255, 0.05);\n  }\n\n  .kyro-toast-accent {\n    position: absolute;\n    left: 0;\n    top: 0;\n    bottom: 0;\n    width: 4px;\n    background: var(--kyro-primary);\n  }\n\n  .kyro-toast-success .kyro-toast-accent { background: #10b981; }\n  .kyro-toast-error .kyro-toast-accent { background: #ef4444; }\n  .kyro-toast-warning .kyro-toast-accent { background: #f59e0b; }\n  .kyro-toast-info .kyro-toast-accent { background: #3b82f6; }\n\n  .kyro-toast-icon-container {\n    flex-shrink: 0;\n    width: 32px;\n    height: 32px;\n    border-radius: 10px;\n    background: rgba(255, 255, 255, 0.05);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: rgba(255, 255, 255, 0.9);\n  }\n\n  .kyro-toast-success .kyro-toast-icon-container { color: #10b981; background: rgba(16, 185, 129, 0.1); }\n  .kyro-toast-error .kyro-toast-icon-container { color: #f87171; background: rgba(239, 68, 68, 0.1); }\n  .kyro-toast-warning .kyro-toast-icon-container { color: #fbbf24; background: rgba(245, 158, 11, 0.1); }\n  .kyro-toast-info .kyro-toast-icon-container { color: #60a5fa; background: rgba(59, 130, 246, 0.1); }\n\n  .kyro-toast-content {\n    flex: 1;\n    min-width: 0;\n  }\n\n  .kyro-toast-message {\n    font-size: 13px;\n    font-weight: 600;\n    letter-spacing: -0.01em;\n    color: rgba(255, 255, 255, 0.9);\n    line-height: 1.4;\n  }\n\n  .kyro-toast-close {\n    padding: 6px;\n    border-radius: 8px;\n    color: rgba(255, 255, 255, 0.4);\n    transition: all 0.2s ease;\n  }\n\n  .kyro-toast-close:hover {\n    background: rgba(255, 255, 255, 0.1);\n    color: white;\n  }\n\n  /* Spinner — Monochrome */\n  .kyro-spinner {\n    animation: spin 0.8s linear infinite;\n    color: var(--kyro-black);\n  }\n\n  /* Alias used by inline upload spinner */\n  .kyro-spin {\n    animation: spin 0.8s linear infinite;\n  }\n\n  .kyro-spinner-sm {\n    width: 14px;\n    height: 14px;\n  }\n\n  .kyro-spinner-md {\n    width: 20px;\n    height: 20px;\n  }\n\n  .kyro-spinner-lg {\n    width: 28px;\n    height: 28px;\n  }\n\n  @keyframes spin {\n    from {\n      transform: rotate(0deg);\n    }\n\n    to {\n      transform: rotate(360deg);\n    }\n  }\n\n  .kyro-loading {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 48px;\n    color: var(--kyro-gray-500);\n  }\n\n  /* Modal — Monochrome */\n  .kyro-modal-overlay {\n    position: fixed;\n    inset: 0;\n    background: rgba(11, 18, 34, 0.6);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 9999;\n    backdrop-filter: blur(4px);\n    pointer-events: auto;\n  }\n\n  .kyro-modal {\n    background: var(--kyro-surface);\n    border-radius: 10px;\n    padding: 24px;\n    max-width: 400px;\n    width: 100%;\n    animation: modal-in 0.2s ease;\n  }\n\n  @keyframes modal-in {\n    from {\n      transform: scale(0.95);\n      opacity: 0;\n    }\n\n    to {\n      transform: scale(1);\n      opacity: 1;\n    }\n  }\n\n  .kyro-modal h3 {\n    margin: 0 0 8px;\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-modal p {\n    margin: 0 0 16px;\n    color: var(--kyro-text-secondary);\n    font-size: 14px;\n  }\n\n  .kyro-modal-actions {\n    display: flex;\n    justify-content: flex-end;\n    gap: 8px;\n  }\n\n  /* Searchable Relationship Modal */\n  .kyro-relation-modal {\n    background: var(--kyro-surface);\n    border-radius: 12px;\n    max-width: 520px;\n    width: 100%;\n    max-height: 80vh;\n    display: flex;\n    flex-direction: column;\n    animation: modal-in 0.2s ease;\n    overflow: hidden;\n    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);\n  }\n\n  .kyro-relation-modal-header {\n    padding: 20px 24px 0;\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .kyro-relation-modal-header h3 {\n    font-size: 16px;\n    font-weight: 600;\n    color: var(--kyro-text-primary);\n    margin: 0;\n  }\n\n  .kyro-relation-modal-search {\n    width: 100%;\n    padding: 10px 12px;\n    font-size: 14px;\n    color: var(--kyro-text-primary);\n    background: var(--kyro-surface-accent);\n    border: 1px solid var(--kyro-border);\n    border-radius: 6px;\n    transition: all 150ms ease;\n    font-family: inherit;\n  }\n\n  .kyro-relation-modal-search:focus {\n    outline: none;\n    border-color: var(--kyro-black);\n    box-shadow: 0 0 0 3px var(--kyro-sidebar-border);\n    background: var(--kyro-surface);\n  }\n\n  .kyro-relation-modal-search::placeholder {\n    color: var(--kyro-gray-400);\n  }\n\n  .kyro-relation-modal-list {\n    flex: 1;\n    overflow-y: auto;\n    padding: 8px;\n    max-height: 320px;\n  }\n\n  .kyro-relation-modal-item {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    width: 100%;\n    padding: 10px 16px;\n    font-size: 14px;\n    color: var(--kyro-text-primary);\n    background: transparent;\n    border: none;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 100ms ease;\n    text-align: left;\n    font-family: inherit;\n  }\n\n  .kyro-relation-modal-item:hover {\n    background: var(--kyro-surface-accent);\n  }\n\n  .kyro-relation-modal-item.selected {\n    background: var(--kyro-black);\n    color: var(--kyro-sidebar-text-active);\n  }\n\n  .kyro-relation-modal-item-id {\n    font-size: 11px;\n    color: var(--kyro-gray-400);\n    font-family: monospace;\n  }\n\n  .kyro-relation-modal-item.selected .kyro-relation-modal-item-id {\n    color: rgba(255, 255, 255, 0.6);\n  }\n\n  .kyro-relation-modal-empty {\n    padding: 32px;\n    text-align: center;\n    color: var(--kyro-gray-400);\n    font-size: 13px;\n  }\n\n  .kyro-relation-modal-footer {\n    padding: 16px 24px;\n    border-top: 1px solid var(--kyro-border);\n    display: flex;\n    justify-content: flex-end;\n    gap: 8px;\n  }\n\n  /* Color picker */\n  .kyro-color {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n  }\n\n  .kyro-color-swatch {\n    width: 36px;\n    height: 36px;\n    border-radius: 6px;\n    border: 1px solid var(--kyro-border);\n    cursor: pointer;\n    padding: 0;\n    overflow: hidden;\n  }\n\n  .kyro-color-swatch::-webkit-color-swatch-wrapper {\n    padding: 0;\n  }\n\n  .kyro-color-swatch::-webkit-color-swatch {\n    border: none;\n    border-radius: 5px;\n  }\n\n  /* Login Page */\n  .kyro-login-page {\n    min-height: 100vh;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: var(--kyro-bg);\n    padding: 20px;\n  }\n\n  .kyro-login-container {\n    width: 100%;\n    max-width: 400px;\n    background: var(--kyro-surface);\n    border-radius: var(--kyro-radius-lg);\n    box-shadow: var(--kyro-shadow-tile);\n    padding: 40px 32px;\n  }\n\n  .kyro-login-header {\n    text-align: center;\n    margin-bottom: 32px;\n  }\n\n  .kyro-login-title {\n    font-size: 24px;\n    font-weight: 700;\n    color: var(--kyro-text-primary);\n    margin: 0 0 8px;\n    letter-spacing: -0.02em;\n  }\n\n  .kyro-login-subtitle {\n    font-size: 14px;\n    color: var(--kyro-gray-500);\n    margin: 0;\n  }\n\n  .kyro-login-form {\n    display: flex;\n    flex-direction: column;\n    gap: 20px;\n  }\n\n  .kyro-login-form .kyro-form-group {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n  }\n\n  .kyro-login-form .kyro-form-group label {\n    font-size: 13px;\n    font-weight: 500;\n    color: var(--kyro-text-primary);\n  }\n\n  .kyro-login-form .kyro-form-group input {\n    width: 100%;\n    padding: 10px 12px;\n    font-size: 14px;\n    color: var(--kyro-text-primary);\n    background: var(--kyro-input-bg);\n    border: 1px solid var(--kyro-input-border);\n    border-radius: 6px;\n    transition: all 150ms ease;\n    font-family: inherit;\n  }\n\n  .kyro-login-form .kyro-form-group input:hover {\n    border-color: var(--kyro-gray-300);\n  }\n\n  .kyro-login-form .kyro-form-group input:focus {\n    outline: none;\n    border-color: var(--kyro-black);\n    box-shadow: 0 0 0 3px var(--kyro-sidebar-border);\n  }\n\n  .kyro-login-form .kyro-form-group input::placeholder {\n    color: var(--kyro-gray-400);\n  }\n\n  .kyro-login-form button[type=\"submit\"] {\n    width: 100%;\n    margin-top: 8px;\n  }\n\n  .kyro-login-footer {\n    margin-top: 24px;\n    text-align: center;\n  }\n\n  .kyro-login-footer p {\n    font-size: 14px;\n    color: var(--kyro-gray-500);\n    margin: 0;\n  }\n\n  .kyro-login-link {\n    background: none;\n    border: none;\n    color: var(--kyro-text-primary);\n    font-weight: 600;\n    cursor: pointer;\n    font-size: 14px;\n    padding: 0;\n    text-decoration: underline;\n    font-family: inherit;\n  }\n\n  .kyro-login-link:hover {\n    color: var(--kyro-black-hover);\n    text-decoration: none;\n  }\n\n  /* Sidebar User Info */\n  .kyro-sidebar-user-info {\n    padding: 8px;\n    border-top: 1px solid var(--kyro-sidebar-border);\n    margin-bottom: 4px;\n  }\n\n  .kyro-sidebar-user-email {\n    font-size: 12px;\n    font-weight: 500;\n    color: var(--kyro-gray-700);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .kyro-sidebar-user-role {\n    font-size: 10px;\n    font-weight: 600;\n    text-transform: none;\n    letter-spacing: 0.05em;\n    color: var(--kyro-gray-500);\n    margin-bottom: 4px;\n  }\n\n  .kyro-sidebar-logout {\n    color: var(--kyro-gray-400) !important;\n  }\n\n  .kyro-sidebar-logout:hover {\n    color: var(--kyro-black) !important;\n    background: var(--kyro-surface-accent);\n  }\n}\n\n/* ============================================================================\n   PORTABLE TEXT EDITOR\n   Basic styles for Portable Text Editor - handled by component inline styles\n   ============================================================================ */\n\n/* End of styles */\n\n.tiptap-editor-wrapper .ProseMirror {\n  outline: none;\n}\n\n.tiptap-editor-wrapper .ProseMirror>*+* {\n  margin-top: 0.75em;\n}\n\n/* NodeView wrapper isolation - prevents CSS Grid/Flexbox interference */\n.tiptap-editor-wrapper [data-node-view-wrapper],\n.tiptap-editor-wrapper [data-node-view-wrapper] * {\n  isolation: isolate;\n  position: relative;\n}\n\n/* Block node styles */\n.tiptap-editor-wrapper .tiptap-hero-block,\n.tiptap-editor-wrapper .tiptap-heading-block,\n.tiptap-editor-wrapper .tiptap-paragraph-block,\n.tiptap-editor-wrapper .tiptap-quote-block,\n.tiptap-editor-wrapper .tiptap-code-block,\n.tiptap-editor-wrapper .tiptap-image-block,\n.tiptap-editor-wrapper .tiptap-video-block,\n.tiptap-editor-wrapper .tiptap-divider-block,\n.tiptap-editor-wrapper .tiptap-button-block,\n.tiptap-editor-wrapper .tiptap-callout-block {\n  position: relative;\n  z-index: 1;\n}\n\n/* Layout blocks with proper isolation */\n.tiptap-editor-wrapper .tiptap-columns-block,\n.tiptap-editor-wrapper .tiptap-stack-block,\n.tiptap-editor-wrapper .tiptap-column-block,\n.tiptap-editor-wrapper .tiptap-group-block,\n.tiptap-editor-wrapper .tiptap-card-block,\n.tiptap-editor-wrapper .tiptap-repeater-block,\n.tiptap-editor-wrapper .tiptap-accordion-block {\n  position: relative;\n  z-index: 1;\n  isolation: isolate;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-grid[data-node-view-content] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.75rem;\n  align-items: start;\n  font-size: 0;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-grid[data-node-view-content]>* {\n  font-size: 0.875rem;\n  min-width: 0;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-grid--1[data-node-view-content] {\n  display: block;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-grid--2[data-node-view-content] {\n  display: flex;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-grid--3[data-node-view-content] {\n  display: flex;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-grid--4[data-node-view-content] {\n  display: flex;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-grid--5[data-node-view-content] {\n  display: flex;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-grid--6[data-node-view-content] {\n  display: flex;\n}\n\n.tiptap-editor-wrapper .tiptap-column-block {\n  display: inline-block;\n  font-size: 0.875rem;\n  flex: 0 0 auto;\n  min-width: 0;\n  height: 100%;\n  vertical-align: top;\n}\n\n.tiptap-editor-wrapper .tiptap-column-content[data-node-view-content] {\n  display: block;\n  min-height: 84px;\n}\n\n.tiptap-editor-wrapper .tiptap-column-content[data-node-view-content]>*:first-child {\n  margin-top: 0;\n}\n\n.tiptap-editor-wrapper .tiptap-column-content[data-node-view-content]>*:last-child {\n  margin-bottom: 0;\n}\n\n.tiptap-editor-wrapper .tiptap-stack-block [data-node-view-content],\n.tiptap-editor-wrapper .tiptap-group-block [data-node-view-content],\n.tiptap-editor-wrapper .tiptap-card-block [data-node-view-content] {\n  display: contents;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--1 .tiptap-column-block {\n  width: 100%;\n  flex-basis: 100%;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--1 .tiptap-columns-grid[data-node-view-content]>* {\n  width: 100%;\n  flex: 0 0 100%;\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--2 .tiptap-column-block {\n  width: calc(50% - 0.375rem);\n  flex-basis: calc(50% - 0.375rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--2 .tiptap-columns-grid[data-node-view-content]>* {\n  width: calc(50% - 0.375rem);\n  flex: 0 0 calc(50% - 0.375rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--3 .tiptap-column-block {\n  width: calc(33.333% - 0.5rem);\n  flex-basis: calc(33.333% - 0.5rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--3 .tiptap-columns-grid[data-node-view-content]>* {\n  width: calc(33.333% - 0.5rem);\n  flex: 0 0 calc(33.333% - 0.5rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--4 .tiptap-column-block {\n  width: calc(25% - 0.5625rem);\n  flex-basis: calc(25% - 0.5625rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--4 .tiptap-columns-grid[data-node-view-content]>* {\n  width: calc(25% - 0.5625rem);\n  flex: 0 0 calc(25% - 0.5625rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--5 .tiptap-column-block {\n  width: calc(20% - 0.6rem);\n  flex-basis: calc(20% - 0.6rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--5 .tiptap-columns-grid[data-node-view-content]>* {\n  width: calc(20% - 0.6rem);\n  flex: 0 0 calc(20% - 0.6rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--6 .tiptap-column-block {\n  width: calc(16.666% - 0.625rem);\n  flex-basis: calc(16.666% - 0.625rem);\n}\n\n.tiptap-editor-wrapper .tiptap-columns-block--6 .tiptap-columns-grid[data-node-view-content]>* {\n  width: calc(16.666% - 0.625rem);\n  flex: 0 0 calc(16.666% - 0.625rem);\n}\n\n@media (max-width: 720px) {\n  .tiptap-editor-wrapper .tiptap-columns-grid[data-node-view-content] {\n    display: block !important;\n  }\n}\n\n/* Drag handle visibility */\n.tiptap-editor-wrapper .group:hover .drag-handle,\n.tiptap-editor-wrapper .group:hover .tiptap-drag-handle {\n  opacity: 1;\n}\n\n/* Ensure NodeViews render correctly within ProseMirror */\n.tiptap-editor-wrapper .ProseMirror .node--component {\n  display: block;\n}"],"mappings":";;;AACA;AAEA;AAEA;AAEE;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAGA;AACA;AACA;AAGA;AACA;AACA;AACA;AAGA;AACA;AAGA;AACA;AAGA;AACA;AACA;AAGA;AACA;AAGA;AAGA;AAGA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAGA;AACA;AAGA;AACA;AAGA;AACA;AACA;AAGA;AACA;AAGA;AAGA;AAEA;AAAA;AAGF;AAiCA;AACE;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAMF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAME;AAAA;AAIF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAAA;AAKJ;AACE;AACE;AACA;AACA;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AAEA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACE;AAAA;AAAA;AAIJ;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAIF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAIF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAyC;AAAA;AACzC;AAAuC;AAAA;AACvC;AAAyC;AAAA;AACzC;AAAsC;AAAA;AAEtC;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAiD;AAAgB;AAAA;AACjE;AAA+C;AAAgB;AAAA;AAC/D;AAAiD;AAAgB;AAAA;AACjE;AAA8C;AAAgB;AAAA;AAE9D;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AACA;AAAA;AAIF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AAAA;AAEI;AAAA;AAAA;AAIA;AAAA;AAAA;AAIJ;AACE;AACA;AACA;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEI;AACA;AAAA;AAAA;AAIA;AACA;AAAA;AAAA;AAIJ;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAIF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAAA;AAWJ;AACE;AAAA;AAGF;AACE;AAAA;AAIF;AAAA;AAEE;AACA;AAAA;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUE;AACA;AAAA;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AAAA;AAAA;AAGE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACE;AAAA;AAAA;AAKJ;AAAA;AAEE;AAAA;AAIF;AACE;AAAA;","names":[]}