@cometchat/card-builder 1.0.1

package/dist/card-builder.css

@@ -0,0 +1,2 @@
+@import "https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200";.bb-root .tl-container{max-width:61.4286rem;margin:0 auto;padding:4.57143rem 1.71429rem}.bb-root .tl-header{text-align:center;margin-bottom:3.14286rem}.bb-root .tl-logo{background:var(--accent-primary);color:#fff;border-radius:.85714rem;justify-content:center;align-items:center;width:3.42857rem;height:3.42857rem;margin:0 auto 1.14286rem;font-size:1.14286rem;font-weight:800;display:flex}.bb-root .tl-title{color:var(--text-primary);font-size:1.14286rem;font-weight:700}.bb-root .tl-subtitle{color:var(--text-secondary);margin-top:.42857rem;font-size:1rem}.bb-root .tl-actions{gap:.71429rem;margin-bottom:2.57143rem;display:flex}.bb-root .tl-search{flex:1}.bb-root .tl-section{margin-bottom:2.57143rem}.bb-root .tl-section-title{color:#141414;margin-bottom:.85714rem;font-size:1rem;font-weight:600}.bb-root .tl-grid{grid-template-columns:repeat(auto-fill,minmax(13.5714rem,1fr));gap:.71429rem;display:grid}.bb-root .tl-card{text-align:left;box-shadow:none;background:#fff;border:1px solid #e9eaeb;border-radius:.57143rem;padding:1.14286rem;transition:all .15s}.bb-root .tl-card:hover{border-color:var(--accent-primary);box-shadow:var(--shadow-sm)}.bb-root .tl-card-badge{text-transform:uppercase;letter-spacing:.5px;color:var(--accent-primary);margin-bottom:.42857rem;font-size:.78571rem;font-weight:700}.bb-root .tl-card-name{color:#141414;font-size:1rem;font-weight:600}.bb-root .tl-card-desc{color:#727272;margin-top:.14286rem;font-size:.85714rem}.bb-root .tl-card-date{color:#bfbfbc;margin-top:.28571rem;font-size:.78571rem}.bb-root .tl-card{position:relative}.bb-root .tl-card-delete{width:1.57143rem;height:1.57143rem;color:var(--text-tertiary);cursor:pointer;opacity:0;background:0 0;border:none;border-radius:.28571rem;justify-content:center;align-items:center;font-size:1rem;transition:all .15s;display:flex;position:absolute;top:.57143rem;right:.57143rem}.bb-root .tl-card:hover .tl-card-delete{opacity:1}.bb-root .tl-card-delete:hover{color:#dc2626;background:#fee2e2}.bb-root .tl-pagination{justify-content:space-between;align-items:center;margin-top:1.14286rem;display:flex}.bb-root .tl-loading{text-align:center;color:var(--text-tertiary);padding:2.85714rem 1.42857rem;font-size:.92857rem}.bb-root .topbar{background:var(--bg-primary);border-bottom:1px solid var(--border-subtle);flex-shrink:0;justify-content:space-between;align-items:center;height:4rem;padding:0 1.42857rem;display:flex;position:relative}.bb-root .topbar-left{align-items:center;gap:.85714rem;display:flex}.bb-root .topbar-back{border-radius:var(--radius-sm);color:var(--text-secondary);padding:.28571rem .42857rem;font-size:1.28571rem}.bb-root .topbar-back:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .topbar-logo{align-items:center;gap:.57143rem;display:flex}.bb-root .topbar-logo-icon{background:var(--accent-primary);color:#fff;border-radius:.42857rem;justify-content:center;align-items:center;width:1.71429rem;height:1.71429rem;font-size:.64286rem;font-weight:800;display:flex}.bb-root .topbar-logo span{color:var(--text-primary);letter-spacing:-.3px;font-size:1.14286rem;font-weight:600}.bb-root .topbar-sep{background:var(--border-medium);width:1px;height:1.14286rem}.bb-root .topbar-title{color:var(--text-secondary);font-size:1rem;font-weight:500}.bb-root .topbar-name{border-radius:var(--radius-sm);min-width:10rem;max-width:14.2857rem;color:var(--text-primary);box-shadow:none;background:0 0;border:1px solid #0000;padding:.42857rem .57143rem;font-size:1rem;font-weight:500}.bb-root .topbar-name:hover{border-color:var(--border-medium)}.bb-root .topbar-name:focus{border-color:var(--accent-primary)}.bb-root .topbar-dirty{color:var(--accent-primary);font-size:.57143rem}.bb-root .topbar-right{align-items:center;gap:.57143rem;display:flex}.bb-root .topbar-btn{color:#414651;background:#fff;border-radius:.57143rem;outline:1px solid #d5d7da;align-items:center;gap:.42857rem;height:2.57143rem;padding:0 1.14286rem;font-size:1rem;font-weight:600;line-height:1.333;transition:all .15s;display:flex}.bb-root .topbar-btn:hover{background:#f5f5f5}.bb-root .topbar-toast{color:#fff;background:var(--success);z-index:2000;border-radius:.57143rem;align-items:center;gap:.57143rem;padding:.85714rem 1.42857rem;font-size:1rem;font-weight:500;display:flex;position:fixed;bottom:1.71429rem;left:50%;transform:translate(-50%);box-shadow:0 .28571rem .85714rem #00000026}.bb-root .modal-subtitle{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin:.85714rem 0 .57143rem;font-size:.78571rem;font-weight:600}.bb-root .modal-field{margin-bottom:.85714rem}.bb-root .modal-label{color:var(--text-secondary);margin-bottom:.42857rem;font-size:.85714rem;font-weight:500;display:block}.bb-root .topbar-btn-icon{border-radius:var(--radius-sm);width:2.28571rem;height:2.28571rem;color:var(--text-secondary);justify-content:center;align-items:center;font-size:1.14286rem;transition:all .15s;display:flex}.bb-root .topbar-btn-icon:hover:not(:disabled){background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .topbar-btn-icon:disabled{opacity:.3;cursor:default}.bb-root .topbar-btn-warn{color:#d97706;background:#fffbeb;border-color:#fcd34d}.bb-root .topbar-btn-warn:hover{background:#fef3c7}.bb-root .topbar-errors{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);z-index:100;min-width:20rem;max-height:14.2857rem;box-shadow:var(--shadow-lg);background:#fff;margin-top:.57143rem;padding:.57143rem;font-size:.85714rem;position:absolute;top:100%;right:0;overflow-y:auto}.bb-root .topbar-error-item{border-radius:.28571rem;flex-direction:column;gap:.14286rem;padding:.42857rem .57143rem;display:flex}.bb-root .topbar-error-item:hover{background:#fef3c7}.bb-root .topbar-error-path{font-family:var(--font-mono);color:#d97706;font-size:.71429rem}.bb-root .topbar-dropdown{position:relative}.bb-root .topbar-dropdown-menu{background:var(--bg-primary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);z-index:100;min-width:12.8571rem;box-shadow:var(--shadow-lg);margin-top:.42857rem;padding:.28571rem;position:absolute;top:100%;right:0}.bb-root .topbar-dropdown-item{width:100%;color:var(--text-primary);border-radius:var(--radius-sm);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:.57143rem;padding:.57143rem .85714rem;font-size:.92857rem;font-weight:400;display:flex}.bb-root .topbar-dropdown-item:hover{background:var(--bg-tertiary)}.bb-root .left-panel{background:var(--bg-primary);border-right:1px solid var(--border-subtle);flex-direction:column;flex-shrink:0;width:22.8571rem;min-width:18.5714rem;max-width:28.5714rem;font-size:1rem;display:flex;overflow:hidden}.bb-root .lp-header{padding:.85714rem .85714rem .57143rem}.bb-root .lp-tabs{background:var(--bg-tertiary);border-radius:.57143rem;grid-template-columns:1fr 1fr;gap:.14286rem;padding:.21429rem;display:grid}.bb-root .lp-tab{height:2.57143rem;color:var(--text-secondary);background:0 0;border-radius:.42857rem;justify-content:center;align-items:center;gap:.42857rem;font-size:.92857rem;font-weight:500;transition:all .15s;display:flex}.bb-root .lp-tab:hover{color:var(--text-primary)}.bb-root .lp-tab.active{background:var(--bg-primary);color:var(--text-primary);box-shadow:0 1px .21429rem #00000014}.bb-root .lp-search-wrap{padding:0 .85714rem .57143rem;position:relative}.bb-root .lp-search-icon{color:var(--text-muted);pointer-events:none;margin-top:-.28571rem;position:absolute;top:50%;left:1.57143rem;transform:translateY(-50%)}.bb-root .lp-search{border:1px solid var(--border-subtle);width:100%;height:2.57143rem;color:var(--text-primary);background:#fafafa;border-radius:.57143rem;padding:0 2.28571rem 0 2.57143rem;font-size:.92857rem;transition:all .15s}.bb-root .lp-search::placeholder{color:var(--text-muted)}.bb-root .lp-search:focus{background:var(--bg-primary);border-color:var(--accent-primary);outline:none;box-shadow:0 0 0 .14286rem #6852d614}.bb-root .lp-search-clear{background:var(--border-medium);width:1.42857rem;height:1.42857rem;color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;margin-top:-.28571rem;transition:background .15s;display:flex;position:absolute;top:50%;right:1.42857rem;transform:translateY(-50%)}.bb-root .lp-search-clear:hover{background:var(--text-muted);color:var(--text-primary)}.bb-root .lp-content{flex:1;padding:.28571rem .57143rem .85714rem;overflow-y:auto}.bb-root .lp-group{margin-bottom:.14286rem}.bb-root .lp-group-header{width:100%;color:var(--text-secondary);cursor:pointer;border-radius:.57143rem;align-items:center;gap:.57143rem;padding:.71429rem;font-size:.92857rem;font-weight:600;transition:all .15s;display:flex}.bb-root .lp-group-header:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .lp-group-header.open{color:var(--text-primary);background:var(--bg-tertiary);font-weight:600}.bb-root .lp-group-header.open .lp-group-icon{color:var(--text-primary)}.bb-root .lp-group-icon{color:var(--text-secondary);transition:color .15s}.bb-root .lp-group-label{text-align:left;flex:1}.bb-root .lp-group-count{color:var(--text-secondary);font-variant-numeric:tabular-nums;font-size:.78571rem;font-weight:500}.bb-root .lp-group-header.open .lp-group-count{color:var(--text-secondary)}.bb-root .lp-group-chevron{color:var(--text-muted);transition:transform .2s,color .15s}.bb-root .lp-group-chevron.collapsed{transform:rotate(-90deg)}.bb-root .lp-group-header.open .lp-group-chevron{color:var(--text-secondary)}.bb-root .lp-group-items{flex-direction:column;gap:.14286rem;margin-left:1.28571rem;padding:.57143rem 0 .28571rem;display:flex;position:relative}.bb-root .lp-group-items:before{content:"";background:var(--border-subtle);width:1px;position:absolute;top:0;bottom:2rem;left:0}.bb-root .lp-item{text-align:left;border:1px solid #0000;border-radius:.57143rem;align-items:center;gap:.71429rem;width:calc(100% - .85714rem);margin-left:.85714rem;padding:.57143rem .71429rem;transition:all .15s;display:flex;position:relative}.bb-root .lp-item:before{content:"";background:var(--border-subtle);width:.85714rem;height:1px;position:absolute;top:50%;left:-.85714rem}.bb-root .lp-item:hover{background:var(--bg-hover);border-color:var(--border-subtle)}.bb-root .lp-item-icon-wrap{background:var(--bg-tertiary);width:2rem;height:2rem;color:var(--text-secondary);border-radius:.42857rem;flex-shrink:0;justify-content:center;align-items:center;display:flex}.bb-root .lp-item-title{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;overflow:hidden}.bb-root .lp-item--component{align-items:flex-start}.bb-root .lp-item-info{flex-direction:column;flex:1;gap:.14286rem;min-width:0;display:flex}.bb-root .lp-item-sub{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;line-height:1.3;overflow:hidden}.bb-root .lp-empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:2.85714rem 1.42857rem;display:flex}.bb-root .lp-empty-icon{color:var(--border-medium);margin-bottom:.57143rem}.bb-root .lp-empty-title{color:var(--text-secondary);font-size:.92857rem;font-weight:500}.bb-root .lp-empty-sub{color:var(--text-muted);margin-top:.28571rem;font-size:.85714rem}.bb-root .lp-footer{border-top:1px dashed var(--border-subtle);padding:.71429rem}.bb-root .lp-footer-drop{border:1px dashed var(--border-subtle);color:var(--text-secondary);cursor:pointer;border-radius:.57143rem;justify-content:center;align-items:center;gap:.42857rem;padding:.71429rem;font-size:.89286rem;font-weight:500;transition:all .15s;display:flex}.bb-root .lp-footer-drop:hover{border-color:var(--border-medium);color:var(--text-primary);background:var(--bg-tertiary)}.bb-root .canvas{background:var(--bg-secondary);flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.bb-root .canvas-area{background:radial-gradient(circle at 1px 1px,#d4d4d8 1px,#0000 0) 0 0/1rem 1rem;flex:1;justify-content:center;align-items:center;padding:2.28571rem 1.71429rem;display:flex;overflow:auto}.bb-root .phone-frame{background:#fff;border-radius:24px;flex-direction:column;flex-shrink:0;width:340px;height:700px;max-height:700px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 0 1px #0000000f,0 2px 4px #0000000a,0 12px 32px #00000014,0 32px 64px #0000000f}.bb-root .phone-frame:before{content:none}.bb-root .phone-screen{background:#fafafa;flex-direction:column;height:100%;margin-top:0;display:flex;overflow:hidden}.bb-root .chat-header{background:#fff;border-bottom:1px solid #0000000f;align-items:center;padding:20px 16px 14px;display:flex}.bb-root .chat-back-btn{color:var(--text-secondary);opacity:.6;padding:2px 4px;font-size:20px}.bb-root .chat-user{flex:1;align-items:center;gap:10px;margin-left:10px;display:flex}.bb-root .chat-avatar{color:#fff;background:linear-gradient(135deg,#6852d6,#8b7ae8);border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:14px;font-weight:600;display:flex;box-shadow:0 2px 8px #6852d64d}.bb-root .chat-name{color:var(--text-primary);letter-spacing:-.01em;font-size:14px;font-weight:600}.bb-root .chat-messages{background:#fafafa;flex-direction:column;flex:1;gap:12px;min-height:0;padding:16px;display:flex;overflow:hidden auto}.bb-root .message-date{text-align:center;color:var(--text-tertiary);-webkit-backdrop-filter:blur(.57143rem);backdrop-filter:blur(.57143rem);letter-spacing:.02em;background:#fffc;border-radius:.85714rem;align-self:center;padding:.35714rem .85714rem;font-size:.78571rem;font-weight:500}.bb-root .bubble-preview{flex-shrink:0;align-self:flex-start;width:100%;min-height:50px;position:relative;overflow:visible}.bb-root .canvas-bubble{border-radius:16px 16px 16px 4px;flex-direction:column;gap:2px;display:flex;overflow:visible;box-shadow:0 1px 2px #0000000f,0 1px 3px #0000000a}.bb-root .canvas-empty{color:var(--text-tertiary);text-align:center;border:.14286rem dashed var(--border-medium);background-color:#fff;border-radius:1.14286rem;flex-direction:column;justify-content:center;align-items:center;gap:.85714rem;margin:auto .85714rem;padding:2.28571rem 1.42857rem;font-size:.92857rem;display:flex}.bb-root .canvas-empty-template-btn{background:var(--bg-tertiary);border:1px solid var(--border-subtle);color:#404040;cursor:pointer;border-radius:.57143rem;margin-top:.85714rem;padding:.57143rem 1.14286rem;font-size:.92857rem;font-weight:600;transition:all .15s}.bb-root .canvas-empty-template-btn:hover{border-color:var(--accent-primary);background:var(--accent-light);color:var(--accent-primary)}.bb-root .canvas-empty-circle{background:#f5f5f5;border-radius:50%;justify-content:center;align-items:center;width:3.42857rem;height:3.42857rem;display:flex}.bb-root .canvas-empty-plus{color:#a3a3a3;font-size:1.71429rem;font-weight:300}.bb-root .canvas-empty-title{color:var(--text-primary);font-size:1rem;font-weight:600}.bb-root .canvas-empty-sub{color:#404040;font-size:.92857rem}.bb-root .chat-input-area{background:#fff;border-top:1px solid #0000000f;align-items:center;gap:10px;padding:10px 14px;display:flex}.bb-root .chat-input{border:1px solid var(--border-subtle);color:var(--text-primary);background:#f5f6f7;border-radius:20px;flex:1;padding:9px 16px;font-size:13px}.bb-root .chat-send-btn{background:var(--accent-primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;font-size:13px;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 2px 8px #6852d64d}.bb-root .chat-send-btn:hover{transform:scale(1.05);box-shadow:0 4px 12px #6852d666}.bb-root .el-wrapper{cursor:pointer;border-radius:4px;width:100%;transition:all .12s;position:relative;overflow:visible}.bb-root .el-wrapper:hover{background:#6852d60a}.bb-root .el-wrapper.selected{outline:2px solid var(--accent-primary);outline-offset:-2px;background:#6852d60a}.bb-root .el-wrapper.multi-selected{outline:2px dashed var(--accent-primary);outline-offset:-2px;background:#6852d60a}.bb-root .el-controls-portal{z-index:9999;background:#fff;border-radius:.57143rem;flex-direction:row;gap:.14286rem;padding:.21429rem;display:flex;box-shadow:0 .14286rem .85714rem #0000001f,0 0 0 1px #0000000a}.bb-root .preview-mode .el-controls-portal{display:none}.bb-root .el-ctrl-btn{width:1.85714rem;height:1.85714rem;color:var(--text-secondary);border-radius:.35714rem;justify-content:center;align-items:center;font-size:.92857rem;transition:all .12s;display:flex}.bb-root .el-ctrl-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .el-ctrl-btn.danger:hover{color:#dc2626;background:#fee2e2}.bb-root .el-wrap-menu{border:1px solid var(--border-subtle);z-index:1001;background:#fff;border-radius:.71429rem;min-width:10rem;margin-bottom:.28571rem;padding:.28571rem;position:absolute;bottom:100%;right:0;box-shadow:0 .57143rem 1.71429rem #0000001f}.bb-root .el-wrap-option{text-align:left;color:var(--text-secondary);white-space:nowrap;border-radius:.42857rem;width:100%;padding:.5rem .85714rem;font-size:.85714rem}.bb-root .el-wrap-option:hover{background:var(--accent-light);color:var(--accent-primary)}.bb-root .canvas-breadcrumbs{border-bottom:1px solid var(--border-subtle);background:#fff;flex-wrap:wrap;align-items:center;gap:.14286rem;padding:.42857rem 1.14286rem;font-size:.85714rem;display:flex}.bb-root .canvas-bc-sep{color:var(--text-muted);margin:0 .14286rem;font-size:.71429rem}.bb-root .canvas-bc-item{color:var(--text-secondary);font-size:.78571rem;font-family:var(--font-mono);border-radius:.28571rem;padding:.14286rem .57143rem}.bb-root .canvas-bc-item:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .canvas-bc-item.active{color:var(--accent-primary);background:var(--accent-light)}.bb-root .multi-select-bar{border:1px solid var(--border-subtle);z-index:100;background:#fff;border-radius:.85714rem;align-items:center;gap:.57143rem;padding:.57143rem 1.14286rem;font-size:.92857rem;display:flex;position:absolute;bottom:4.28571rem;left:50%;transform:translate(-50%);box-shadow:0 .57143rem 1.71429rem #0000001f}.bb-root .multi-select-bar span{color:var(--text-secondary);white-space:nowrap}.bb-root .multi-select-bar button{background:var(--accent-light);color:var(--accent-primary);white-space:nowrap;border-radius:.42857rem;padding:.42857rem .85714rem;font-size:.85714rem;font-weight:600;transition:all .15s}.bb-root .multi-select-bar button:hover{background:var(--accent-primary);color:#fff}.bb-root .canvas-bubble ::-webkit-scrollbar{height:3px}.bb-root .canvas-bubble ::-webkit-scrollbar-track{background:0 0}.bb-root .canvas-bubble ::-webkit-scrollbar-thumb{background:#00000026;border-radius:2px}.bb-root .canvas-toolbar{border-top:1px solid var(--border-subtle);background:#fff;flex-shrink:0;justify-content:center;align-items:center;gap:.28571rem;padding:.42857rem .85714rem;font-size:.85714rem;display:flex}.bb-root .canvas-tool-btn{width:2rem;height:2rem;color:var(--text-secondary);border-radius:.42857rem;justify-content:center;align-items:center;font-size:1rem;transition:all .12s;display:flex}.bb-root .canvas-tool-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .canvas-tool-btn.active{background:var(--accent-light);color:var(--accent-primary)}.bb-root .canvas-tool-label{color:var(--text-secondary);text-align:center;min-width:2.57143rem;font-size:.78571rem}.bb-root .canvas-tool-sep{background:var(--border-medium);width:1px;height:1.14286rem;margin:0 .28571rem}.bb-root .preview-mode .el-wrapper{cursor:default}.bb-root .preview-mode .el-wrapper:hover{background:0 0}.bb-root .preview-mode .el-wrapper.selected,.bb-root .preview-mode .el-wrapper.multi-selected{background:0 0;outline:none}.bb-root .preview-mode .canvas-breadcrumbs,.bb-root .preview-mode .multi-select-bar{display:none}.bb-root .json-preview-panel{background:var(--bg-primary);border-left:1px solid var(--border-subtle);z-index:60;flex-direction:column;width:27.1429rem;display:flex;position:absolute;top:0;bottom:0;right:0;box-shadow:-.28571rem 0 1.71429rem #0000000f}.bb-root .json-preview-header{border-bottom:1px solid var(--border-subtle);color:var(--text-primary);background:var(--bg-secondary);align-items:center;gap:.57143rem;padding:.85714rem 1.14286rem;font-size:.92857rem;font-weight:600;display:flex}.bb-root .json-preview-header span{flex:1}.bb-root .json-preview-header button{width:2rem;height:2rem;color:var(--text-secondary);background:0 0;border:none;border-radius:.28571rem;justify-content:center;align-items:center;font-size:1rem;display:flex}.bb-root .json-preview-header button:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .json-preview-code{font-family:var(--font-mono);color:var(--text-primary);white-space:pre;tab-size:2;background:var(--bg-primary);flex:1;margin:0;padding:1.14286rem;font-size:.85714rem;line-height:1.6;overflow:auto}.bb-root .el-context-menu{background:var(--bg-primary);border:1px solid var(--border-subtle);border-radius:.71429rem;min-width:11.4286rem;padding:.28571rem;font-size:.85714rem;box-shadow:0 .57143rem 1.71429rem #0000001f}.bb-root .el-ctx-item{text-align:left;width:100%;color:var(--text-secondary);white-space:nowrap;border-radius:.42857rem;padding:.42857rem .85714rem;display:block}.bb-root .el-ctx-item:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .el-ctx-item.danger:hover{color:#dc2626;background:#fee2e2}.bb-root .el-ctx-sep{background:var(--border-subtle);height:1px;margin:.28571rem 0}.bb-root .canvas-side-toolbar{z-index:50;flex-direction:column;align-items:center;gap:1.71429rem;display:flex;position:absolute;top:50%;right:.85714rem;transform:translateY(-50%)}.bb-root .canvas-side-group{border:1px solid var(--border-subtle);background:#fff;border-radius:.85714rem;flex-direction:column;padding:.28571rem;display:flex;box-shadow:0 1px .21429rem #0000000f}.bb-root .canvas-side-btn{width:2.57143rem;height:2.57143rem;color:var(--text-secondary);border-radius:.57143rem;justify-content:center;align-items:center;transition:all .15s;display:flex}.bb-root .canvas-side-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .canvas-side-btn.active{background:var(--accent-light);color:var(--accent-primary)}.bb-root .canvas.read-only .canvas-area{pointer-events:none}.bb-root .canvas.read-only .canvas-area *{pointer-events:none;-webkit-user-select:none;user-select:none;cursor:default!important}.bb-root .canvas.read-only .chat-messages{pointer-events:auto;overflow-y:auto}.bb-root .canvas.read-only .canvas-side-toolbar{display:none}.bb-root .prop-field--row{align-items:flex-start;gap:.85714rem;display:flex}.bb-root .prop-field--row>.prop-label{flex-shrink:0;width:7.14286rem;margin-bottom:0;padding-top:.57143rem}.bb-root .prop-field--row>.prop-field-input{flex:1;min-width:0}.bb-root .prop-color-row{align-items:center;gap:.71429rem;display:flex}.bb-root .prop-color-pair{align-items:center;gap:.42857rem;display:flex}.bb-root .prop-color-circle{cursor:pointer;border:1px solid var(--border-subtle);border-radius:.57143rem;flex-shrink:0;width:2.28571rem;height:2.28571rem;transition:border-color .15s;position:relative}.bb-root .prop-color-circle:hover{border-color:var(--border-medium)}.bb-root .prop-color-circle input[type=color]{cursor:pointer;opacity:0;border:none;border-radius:.57143rem;width:100%;height:100%;padding:0;position:absolute;top:0;left:0}.bb-root .prop-color-tag{-webkit-user-select:none;user-select:none;border-radius:.28571rem;padding:.21429rem .42857rem;font-size:.71429rem;font-weight:600;line-height:1}.bb-root .prop-color-tag--light{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-subtle)}.bb-root .prop-color-tag--dark{color:#adb5bd;background:#1a1a1a;border:1px solid #495057}.bb-root .prop-color-clear{width:1.71429rem;height:1.71429rem;color:var(--text-tertiary);background:var(--bg-tertiary);border:1px solid var(--border-subtle);cursor:pointer;border-radius:.42857rem;justify-content:center;align-items:center;font-size:.85714rem;transition:all .15s;display:flex}.bb-root .prop-color-clear:hover{color:#dc2626;background:#fef2f2;border-color:#fecaca}.bb-root .prop-padding-row{align-items:center;gap:.42857rem;display:flex}.bb-root .prop-padding-row input{flex:1}.bb-root .prop-padding-toggle{border:1px solid var(--border-subtle);width:40px;height:40px;color:var(--text-muted);background:var(--bg-primary);cursor:pointer;border-radius:.57143rem;flex-shrink:0;justify-content:center;align-items:center;transition:all .15s;display:flex}.bb-root .prop-padding-toggle:hover{background:var(--bg-tertiary);color:var(--text-primary);border-color:var(--border-medium)}.bb-root .prop-padding-toggle.active{background:var(--accent-light);color:var(--accent-primary);border-color:#6852d64d}.bb-root .prop-padding-grid{grid-template-columns:1fr 1fr;gap:.57143rem;margin-top:.57143rem;display:grid}.bb-root .prop-padding-grid label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.28571rem;font-size:.75rem;font-weight:500;display:block}.bb-root .prop-select-wrap{position:relative}.bb-root .prop-select-wrap select{appearance:none;padding-right:2.28571rem}.bb-root .prop-select-arrow{pointer-events:none;color:var(--text-muted);position:absolute;top:50%;right:.71429rem;transform:translateY(-50%)}.bb-root .prop-input-number{-moz-appearance:textfield}.bb-root .prop-input-number::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.bb-root .prop-input-number::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.bb-root .prop-color-section{flex-direction:column;gap:.57143rem;display:flex}.bb-root .prop-color-swatch-row{align-items:center;gap:.71429rem;display:flex}.bb-root .prop-color-swatch{cursor:pointer;border:1px solid var(--border-subtle);border-radius:.57143rem;flex-shrink:0;width:40px;height:40px;transition:border-color .15s;position:relative}.bb-root .prop-color-swatch input[type=color]{cursor:pointer;opacity:0;border:none;border-radius:.57143rem;width:100%;height:100%;padding:0;position:absolute;top:0;left:0}.bb-root .prop-input-hex{flex:1;font-size:13px}.bb-root .prop-padding-wrap{flex-direction:column;gap:.57143rem;width:100%;display:flex}.bb-root .prop-padding-wrap .prop-padding-grid{margin-left:0}.bb-root .prop-align-group{border:1px solid var(--border-subtle);border-radius:.57143rem;display:flex;overflow:hidden}.bb-root .prop-align-btn{background:var(--bg-primary);height:40px;color:var(--text-secondary);border-right:1px solid var(--border-subtle);flex:1;justify-content:center;align-items:center;transition:all .15s;display:flex}.bb-root .prop-align-btn:last-child{border-right:none}.bb-root .prop-align-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .prop-align-btn.active{background:var(--accent-light);color:var(--accent-primary)}.bb-root .prop-switch{cursor:pointer;align-items:center;gap:.85714rem;padding:.42857rem 0;display:flex}.bb-root .prop-switch-track{background:var(--border-medium);border-radius:.71429rem;flex-shrink:0;width:2.57143rem;height:1.42857rem;transition:background .2s;position:relative}.bb-root .prop-switch-track.on{background:var(--accent-primary)}.bb-root .prop-switch-thumb{background:#fff;border-radius:50%;width:1.14286rem;height:1.14286rem;transition:transform .2s;position:absolute;top:.14286rem;left:.14286rem;box-shadow:0 1px .21429rem #00000026}.bb-root .prop-switch-track.on .prop-switch-thumb{transform:translate(1.14286rem)}.bb-root .prop-switch-label{width:7.14286rem;color:var(--text-tertiary);flex-shrink:0;font-size:13px;font-weight:400}.bb-root .prop-image-preview{object-fit:cover;border:1px solid var(--border-subtle);border-radius:.57143rem;width:100%;max-height:8.57143rem;margin:.28571rem 0 .57143rem}.bb-root .prop-section-header{align-items:center;gap:.57143rem;margin-top:.57143rem;padding:.57143rem 0;display:flex}.bb-root .prop-section-header .material-symbols-outlined{color:var(--text-muted)}.bb-root .prop-color-header{justify-content:space-between;align-items:center;margin-bottom:1.14286rem;display:flex}.bb-root .prop-color-field{align-items:flex-start;gap:.85714rem;margin-bottom:.85714rem;display:flex}.bb-root .prop-color-field-label{width:7.14286rem;color:var(--text-tertiary);flex-shrink:0;padding-top:.57143rem;font-size:13px;font-weight:400}.bb-root .prop-color-field-input{flex:1;align-items:center;gap:.71429rem;min-width:0;display:flex}.bb-root .prop-image-upload-placeholder{border:.14286rem dashed var(--border-medium);background:var(--bg-tertiary);cursor:pointer;border-radius:.57143rem;flex-direction:column;justify-content:center;align-items:center;width:100%;height:8.57143rem;margin-bottom:.85714rem;transition:all .15s;display:flex}.bb-root .prop-image-upload-placeholder:hover{border-color:var(--accent-primary);background:var(--accent-light)}.bb-root .prop-image-upload-icon{color:var(--text-muted);margin-bottom:.57143rem}.bb-root .prop-image-upload-placeholder:hover .prop-image-upload-icon{color:var(--accent-primary)}.bb-root .prop-image-upload-text{color:var(--text-secondary);font-size:.92857rem;font-weight:500}.bb-root .prop-image-upload-hint{color:var(--text-muted);margin-top:.14286rem;font-size:.78571rem}.bb-root .prop-image-preview-container{border:1px solid var(--border-subtle);cursor:pointer;border-radius:.57143rem;width:100%;height:12.8571rem;margin-bottom:.85714rem;position:relative;overflow:hidden}.bb-root .prop-image-preview-container:hover .prop-image-preview-overlay{opacity:1}.bb-root .prop-image-preview-img{object-fit:contain;background:var(--bg-tertiary);width:100%;height:100%}.bb-root .prop-image-preview-overlay{color:#fff;opacity:0;background:#0000004d;justify-content:center;align-items:center;gap:.42857rem;font-size:.85714rem;font-weight:500;transition:opacity .15s;display:flex;position:absolute;inset:0}.bb-root .prop-image-modal-backdrop{z-index:9999;-webkit-backdrop-filter:blur(.28571rem);backdrop-filter:blur(.28571rem);background:#000000b3;justify-content:center;align-items:center;padding:2.28571rem;display:flex;position:fixed;inset:0}.bb-root .prop-image-modal{background:#fff;border-radius:.85714rem;max-width:90vw;max-height:90vh;position:relative;overflow:hidden;box-shadow:0 1.42857rem 4.28571rem #0000004d}.bb-root .prop-image-modal-img{object-fit:contain;max-width:90vw;max-height:80vh;display:block}.bb-root .prop-image-modal-close{color:#fff;background:#00000080;border-radius:.57143rem;justify-content:center;align-items:center;width:2.57143rem;height:2.57143rem;transition:background .15s;display:flex;position:absolute;top:.85714rem;right:.85714rem}.bb-root .prop-image-modal-close:hover{background:#000000b3}.bb-root .prop-image-modal-footer{color:#fff;background:linear-gradient(#0000,#0009);justify-content:space-between;align-items:center;padding:.85714rem 1.14286rem;font-size:.85714rem;display:flex;position:absolute;bottom:0;left:0;right:0}.bb-root .prop-image-modal-close-btn{color:#fff;background:#fff3;border-radius:.57143rem;align-items:center;gap:.42857rem;padding:.42857rem .85714rem;font-size:.85714rem;font-weight:500;transition:background .15s;display:flex}.bb-root .prop-image-modal-close-btn:hover{background:#ffffff4d}.bb-root .notif-help-box{background:var(--bg-tertiary);color:var(--text-secondary);border-radius:.57143rem;align-items:flex-start;gap:.57143rem;padding:.85714rem;font-size:.89286rem;line-height:1.5;display:flex}.bb-root .notif-help-icon{color:var(--text-muted);flex-shrink:0;margin-top:1px}.bb-root .var-header{justify-content:space-between;align-items:center;display:flex}.bb-root .var-add-btn{background:var(--accent-primary);color:#fff;border-radius:.57143rem;align-items:center;gap:.28571rem;padding:.57143rem 1rem;font-size:.92857rem;font-weight:600;transition:background .15s;display:flex}.bb-root .var-add-btn:hover{background:var(--accent-secondary)}.bb-root .var-empty{text-align:center;flex-direction:column;align-items:center;padding:2.28571rem 1.14286rem;display:flex}.bb-root .var-empty-icon{background:var(--bg-tertiary);width:3.42857rem;height:3.42857rem;color:var(--text-muted);border-radius:1.71429rem;justify-content:center;align-items:center;margin-bottom:.85714rem;display:flex}.bb-root .var-empty-title{color:var(--text-secondary);font-size:.92857rem;font-weight:500}.bb-root .var-empty-sub{color:var(--text-muted);margin-top:.28571rem;font-size:.85714rem}.bb-root .var-count{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);margin-bottom:.85714rem;font-size:.78571rem;font-weight:600}.bb-root .var-list{flex-direction:column;gap:.71429rem;display:flex}.bb-root .var-item{border:1px solid var(--border-subtle);background:#fff;border-radius:.85714rem;transition:border-color .15s,box-shadow .15s;position:relative;overflow:hidden}.bb-root .var-item:hover{border-color:#6852d633;box-shadow:0 1px .21429rem #0000000a}.bb-root .var-item-top{align-items:center;gap:.71429rem;padding:.85714rem 1rem .57143rem;display:flex}.bb-root .var-item-icon{background:var(--accent-light);width:1.71429rem;height:1.71429rem;color:var(--accent-primary);border-radius:.42857rem;flex-shrink:0;justify-content:center;align-items:center;display:flex}.bb-root .var-item-name{color:var(--text-primary);background:#00000008;border-radius:.28571rem;flex:1;padding:.14286rem .57143rem;font-size:.92857rem;font-weight:600}.bb-root .var-item-delete{width:2rem;height:2rem;color:var(--text-muted);opacity:1;border-radius:.57143rem;flex-shrink:0;justify-content:center;align-items:center;transition:all .15s;display:flex}.bb-root .var-item:hover .var-item-delete{color:var(--text-muted)}.bb-root .var-item-delete:hover{background:#fef2f2;color:#dc2626!important}.bb-root .var-item-details{flex-direction:column;gap:.28571rem;padding:0 1rem .85714rem;display:flex}.bb-root .var-item-detail{color:var(--text-secondary);align-items:center;gap:.42857rem;font-size:.85714rem;display:flex}.bb-root .var-item-detail .material-symbols-outlined{color:var(--text-muted)}.bb-root .var-item-category{text-transform:uppercase;letter-spacing:.5px;color:var(--accent-primary);background:var(--accent-light);border-radius:.71429rem;align-self:flex-start;margin-top:.28571rem;padding:.14286rem .57143rem;font-size:.71429rem;font-weight:600}.bb-root .var-delete-overlay{z-index:10;-webkit-backdrop-filter:blur(.14286rem);backdrop-filter:blur(.14286rem);color:var(--text-primary);background:#fffffff2;border:1px solid #fecaca;border-radius:.85714rem;flex-direction:column;justify-content:center;align-items:center;gap:.57143rem;font-size:.85714rem;font-weight:500;display:flex;position:absolute;inset:0}.bb-root .var-delete-icon{color:#dc2626}.bb-root .var-delete-actions{gap:.57143rem;margin-top:.28571rem;display:flex}.bb-root .var-delete-confirm{color:#fff;background:#dc2626;border-radius:.57143rem;padding:.42857rem 1rem;font-size:.85714rem;font-weight:600}.bb-root .var-delete-confirm:hover{background:#b91c1c}.bb-root .var-delete-cancel{border:1px solid var(--border-subtle);color:var(--text-secondary);border-radius:.57143rem;padding:.42857rem 1rem;font-size:.85714rem;font-weight:500}.bb-root .var-delete-cancel:hover{background:var(--bg-tertiary)}.bb-root .var-form{background:#6852d605;border:1px solid #6852d633;border-radius:.85714rem;margin-bottom:.85714rem;padding:1.14286rem}.bb-root .var-form-title{color:var(--text-primary);margin-bottom:.85714rem;font-size:.92857rem;font-weight:600}.bb-root .var-form-actions{gap:.57143rem;margin-top:.85714rem;display:flex}.bb-root .var-form-btn-primary{background:var(--accent-primary);color:#fff;border-radius:.57143rem;padding:.57143rem 1.14286rem;font-size:.85714rem;font-weight:600;transition:background .15s}.bb-root .var-form-btn-primary:hover{background:var(--accent-secondary)}.bb-root .var-form-btn-secondary{border:1px solid var(--border-subtle);color:var(--text-secondary);border-radius:.57143rem;padding:.57143rem 1.14286rem;font-size:.85714rem;font-weight:500;transition:background .15s}.bb-root .var-form-btn-secondary:hover{background:var(--bg-tertiary)}.bb-root .tree-root{font-size:13px}.bb-root .tree-item{text-align:left;width:100%;color:var(--text-secondary);cursor:pointer;border-radius:.57143rem;align-items:center;gap:.42857rem;min-height:2.28571rem;padding:.42857rem .57143rem;transition:all .15s;display:flex;position:relative}.bb-root .tree-item:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .tree-item.selected{background:var(--bg-tertiary);color:var(--text-primary);transition:none}.bb-root .tree-item:active{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .tree-item.multi-selected{background:var(--accent-light);color:var(--accent-primary);outline:1px dashed var(--accent-primary);outline-offset:-1px}.bb-root .tree-item.drop-target{outline:.14286rem dashed var(--accent-primary);outline-offset:-.14286rem}.bb-root .tree-item.flash{background:var(--bg-tertiary)}@keyframes tree-flash{0%{background:var(--bg-tertiary)}to{background:0 0}}.bb-root .tree-chevron{width:1.14286rem;height:1.14286rem;color:var(--text-muted);cursor:pointer;border-radius:.28571rem;flex-shrink:0;justify-content:center;align-items:center;transition:color .15s;display:flex}.bb-root .tree-chevron:hover,.bb-root .tree-item.selected .tree-chevron{color:var(--text-primary)}.bb-root .tree-spacer{flex-shrink:0;width:1.14286rem}.bb-root .tree-icon-box{border:1px solid var(--border-subtle);background:var(--bg-primary);width:1.71429rem;height:1.71429rem;color:var(--text-secondary);border-radius:.28571rem;flex-shrink:0;justify-content:center;align-items:center;transition:all .15s;display:flex}.bb-root .tree-item:hover .tree-icon-box{border-color:var(--border-medium)}.bb-root .tree-item.selected .tree-icon-box,.bb-root .tree-item.flash .tree-icon-box{border-color:var(--border-medium);background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .tree-type{font-family:Satoshi,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:12px;font-weight:500}.bb-root .tree-type.is-container{font-weight:600}.bb-root .tree-item.selected .tree-type{color:var(--text-primary)}.bb-root .tree-label{color:var(--text-tertiary);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:.78571rem;overflow:hidden}.bb-root .tree-badge{background:var(--bg-tertiary);color:var(--text-tertiary);border-radius:.57143rem;flex-shrink:0;margin-left:auto;padding:1px .35714rem;font-size:.64286rem}.bb-root .tree-item.selected .tree-badge{background:var(--border-subtle);color:var(--text-secondary)}.bb-root .tree-error-dot{background:#dc2626;border-radius:50%;flex-shrink:0;width:.42857rem;height:.42857rem;margin-left:auto}.bb-root .tree-badge+.tree-error-dot,.bb-root .tree-error-dot+.tree-badge{margin-left:.28571rem}.bb-root .tree-children{position:relative}.bb-root .tree-children:before{content:"";background:var(--border-subtle);width:1px;position:absolute;top:0;bottom:.85714rem;left:1.35714rem}.bb-root .tree-empty{color:var(--text-tertiary);flex-direction:column;align-items:center;gap:.57143rem;padding:1.71429rem;font-size:.92857rem;display:flex}.bb-root .tree-drag-overlay{background:var(--bg-primary);opacity:.9;border-radius:.57143rem;box-shadow:0 .28571rem .85714rem #00000026}.bb-root .tree-node{touch-action:none}.bb-root .tree-drop-gap{height:.28571rem;transition:height .1s;position:relative}.bb-root .tree-drop-gap.active{height:.57143rem}.bb-root .tree-drop-gap .tree-drop-line{background:0 0;border-radius:1px;height:.14286rem;transition:background .1s}.bb-root .tree-drop-gap.active .tree-drop-line{background:var(--accent-primary)}.bb-root .tree-search-wrap{margin-bottom:.57143rem;position:relative}.bb-root .tree-search-icon{color:var(--text-muted);pointer-events:none;position:absolute;top:50%;left:.71429rem;transform:translateY(-50%)}.bb-root .tree-search{border:1px solid var(--border-subtle);width:100%;color:var(--text-primary);background:#fafafa;border-radius:.57143rem;padding:.57143rem 2rem .57143rem 2.28571rem;font-size:.85714rem}.bb-root .tree-search:focus{border-color:var(--accent-primary);background:var(--bg-primary);outline:none}.bb-root .tree-search::placeholder{color:var(--text-muted)}.bb-root .tree-search-clear{width:1.42857rem;height:1.42857rem;color:var(--text-tertiary);background:var(--border-medium);border-radius:50%;justify-content:center;align-items:center;transition:all .15s;display:flex;position:absolute;top:50%;right:.57143rem;transform:translateY(-50%)}.bb-root .tree-search-clear:hover{color:var(--text-primary);background:var(--text-muted)}.bb-root .right-panel{background:var(--bg-primary);border-left:1px solid var(--border-subtle);flex-direction:column;flex-shrink:0;width:22.8571rem;min-width:18.5714rem;max-width:28.5714rem;font-size:14px;display:flex;overflow:hidden}.bb-root .rp-tabs{border-bottom:1px solid var(--border-subtle);flex-shrink:0;padding:0 .57143rem;display:flex;overflow:hidden}.bb-root .rp-tab{color:var(--text-secondary);white-space:nowrap;background:0 0;flex:1;justify-content:center;align-items:center;padding:.85714rem .57143rem;font-size:.89286rem;font-weight:500;transition:color .15s;display:flex;position:relative}.bb-root .rp-tab:hover{color:var(--text-primary)}.bb-root .rp-tab.active{color:var(--accent-primary);font-weight:500}.bb-root .rp-tab-indicator{background:var(--accent-primary);border-radius:1px;height:.14286rem;position:absolute;bottom:0;left:.57143rem;right:.57143rem}.bb-root .rp-content{flex:1;padding:1.42857rem 1.14286rem;overflow-y:auto}.bb-root .rp-empty{color:var(--text-tertiary);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.85714rem;padding:3.42857rem 1.71429rem;display:flex}.bb-root .rp-empty-icon{color:var(--border-medium);font-size:3.42857rem}.bb-root .prop-group{margin-bottom:0;padding-bottom:0}.bb-root .prop-group:last-child{border-bottom:none}.bb-root .prop-group-title{color:var(--text-primary);margin-bottom:1.14286rem;font-size:14px;font-weight:600}.bb-root .prop-field{margin-bottom:.85714rem}.bb-root .prop-label{color:var(--text-tertiary);margin-bottom:.42857rem;font-size:13px;font-weight:400;display:block}.bb-root .prop-row{align-items:center;gap:.57143rem;display:flex}.bb-root .prop-row .prop-label{flex-shrink:0;width:7.14286rem;margin-bottom:0}.bb-root .prop-badge{background:var(--accent-light);color:var(--accent-primary);text-transform:uppercase;letter-spacing:.5px;border-radius:.28571rem;margin-bottom:1.14286rem;padding:.28571rem .71429rem;font-size:.78571rem;font-weight:600;display:inline-block}.bb-root .prop-error-summary{color:#dc2626;background:#fef2f2;border:1px solid #fecaca;border-radius:.28571rem;margin-bottom:.85714rem;padding:.42857rem .71429rem;font-size:.85714rem;font-weight:500}.bb-root .prop-field-error input,.bb-root .prop-field-error textarea,.bb-root .prop-field-error select{box-shadow:0 0 0 1px #fecaca;border-color:#dc2626!important}.bb-root .prop-field-error-hint{color:#dc2626;margin-left:.42857rem;font-size:.78571rem;font-weight:400}.bb-root .prop-color-swatch{border:1px solid var(--border-subtle);cursor:pointer;border-radius:.57143rem;flex-shrink:0;width:40px;height:40px;transition:border-color .15s}.bb-root .prop-color-swatch:hover{border-color:var(--border-medium)}.bb-root .prop-toggle-group{border:1px solid var(--border-subtle);border-radius:.57143rem;display:flex;overflow:hidden}.bb-root .prop-toggle-btn{background:var(--bg-primary);height:2.85714rem;color:var(--text-secondary);border-right:1px solid var(--border-subtle);flex:1;justify-content:center;align-items:center;transition:all .15s;display:flex}.bb-root .prop-toggle-btn:last-child{border-right:none}.bb-root .prop-toggle-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .prop-toggle-btn.active{background:var(--accent-light);color:var(--accent-primary)}.bb-root .prop-mode-toggle{border:1px solid var(--border-subtle);border-radius:.57143rem;display:flex;overflow:hidden}.bb-root .prop-mode-btn{background:var(--bg-primary);width:2.57143rem;height:2.57143rem;color:var(--text-muted);border-right:1px solid var(--border-subtle);justify-content:center;align-items:center;transition:all .15s;display:flex}.bb-root .prop-mode-btn:last-child{border-right:none}.bb-root .prop-mode-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .prop-mode-btn.active{background:var(--accent-light);color:var(--accent-primary)}.bb-root .prop-section-divider{background:var(--border-subtle);height:1px;margin:1.14286rem 0}.bb-root .empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:2.28571rem 1.14286rem;display:flex}.bb-root .empty-state-icon{background:var(--bg-tertiary);width:3.42857rem;height:3.42857rem;color:var(--text-muted);border-radius:50%;justify-content:center;align-items:center;margin-bottom:.85714rem;display:flex}.bb-root .empty-state-title{color:#525252;font-size:13px;font-weight:500}.bb-root .empty-state-sub{color:#a3a3a3;max-width:14.2857rem;margin-top:.28571rem;font-size:12px;line-height:1.5}.bb-root .shortcuts-overlay{z-index:10000;-webkit-backdrop-filter:blur(.28571rem);backdrop-filter:blur(.28571rem);background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.bb-root .shortcuts-panel{background:#fff;border-radius:1.14286rem;width:22.8571rem;padding:0;overflow:hidden;box-shadow:0 1.14286rem 3.42857rem #0003}.bb-root .shortcuts-header{border-bottom:1px solid var(--border-subtle);color:var(--text-primary);justify-content:space-between;align-items:center;padding:1.14286rem 1.42857rem;font-size:1rem;font-weight:600;display:flex}.bb-root .shortcuts-close{width:1.71429rem;height:1.71429rem;color:var(--text-tertiary);border-radius:.42857rem;justify-content:center;align-items:center;font-size:1.14286rem;display:flex}.bb-root .shortcuts-close:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bb-root .shortcuts-list{padding:.85714rem 1.42857rem 1.14286rem}.bb-root .shortcut-row{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:.57143rem 0;display:flex}.bb-root .shortcut-row:last-child{border-bottom:none}.bb-root .shortcut-action{color:var(--text-secondary);font-size:.92857rem}.bb-root .shortcut-keys{font-family:var(--font-mono);background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-subtle);border-radius:.28571rem;padding:.21429rem .57143rem;font-size:.78571rem;font-weight:500}.bb-root .editor-root{background:var(--bg-secondary);flex-direction:column;width:100%;height:100%;font-family:Satoshi,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:flex}.bb-root .editor-panels{flex:1;display:flex;overflow:hidden}:root{--bg-primary:#fff;--bg-secondary:#f5f5f5;--bg-tertiary:#f5f5f5;--bg-elevated:#fff;--bg-hover:#fafafa;--bg-active:#f3f0ff;--accent-primary:#6852d6;--accent-secondary:#7c6be6;--accent-light:#f3f0ff;--accent-gradient:linear-gradient(135deg, #6852d6 0%, #7c6be6 100%);--accent-glow:#6852d633;--text-primary:#141414;--text-secondary:#727272;--text-tertiary:#414651;--text-muted:#bfbfbc;--border-subtle:#e9eaeb;--border-medium:#d5d7da;--border-accent:#6852d64d;--success:#10b981;--warning:#f59e0b;--error:#d92d20;--shadow-sm:0 1px .14286rem #0000000d;--shadow-md:0 .28571rem .42857rem #00000012;--shadow-lg:0 .71429rem 1.78571rem #0000001a;--radius-sm:.57143rem;--radius-md:.57143rem;--radius-lg:.85714rem;--radius-xl:1.14286rem;--font-sans:"Satoshi", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"SF Mono", "Fira Code", monospace}.bb-root .material-symbols-outlined{font-variation-settings:"FILL" 0, "wght" 400, "GRAD" 0, "opsz" 20;-webkit-user-select:none;user-select:none}.bb-root,.bb-root *{box-sizing:border-box;margin:0;padding:0}.bb-root,.bb-root,.bb-root #root{width:100%;height:100%}.bb-root,.bb-root *,.bb-root :before,.bb-root :after{font-family:Satoshi,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.bb-root{font-family:var(--font-sans);background:var(--bg-secondary);color:var(--text-primary);-webkit-font-smoothing:antialiased;font-size:clamp(14px,.95vw,28px);line-height:1.5}.bb-root ::-webkit-scrollbar{width:.42857rem;height:.42857rem}.bb-root ::-webkit-scrollbar-track{background:0 0}.bb-root ::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:.21429rem}.bb-root ::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}.bb-root button{cursor:pointer;color:inherit;font:inherit;background:0 0;border:none}.bb-root input,.bb-root textarea,.bb-root select{box-sizing:border-box;border:1px solid var(--border-medium);width:100%;height:40px;color:var(--text-primary);background:#fff;border-radius:.57143rem;outline:none;padding:.71429rem .85714rem;font-family:inherit;font-size:13px;font-weight:500;line-height:1.5;transition:border-color .15s}.bb-root textarea{height:auto}.bb-root input:focus,.bb-root textarea:focus,.bb-root select:focus{border-color:var(--accent-primary)}.bb-root input::placeholder,.bb-root textarea::placeholder{color:var(--text-muted);font-weight:400}.bb-root select{appearance:none;cursor:pointer;padding-right:2rem}.bb-root input[type=checkbox]{width:1.14286rem;height:1.14286rem;accent-color:var(--accent-primary)}.bb-root input[type=color]{border:1px solid var(--border-medium);border-radius:var(--radius-sm);background:var(--bg-secondary);cursor:pointer;width:2.85714rem;height:2.57143rem;padding:.14286rem}.bb-root input[type=color]::-webkit-color-swatch-wrapper{padding:.14286rem}.bb-root input[type=color]::-webkit-color-swatch{border:none;border-radius:.28571rem}.bb-root textarea{resize:vertical;min-height:4.28571rem}
+/*$vite$:1*/

package/dist/components/Canvas.d.ts

@@ -0,0 +1,2 @@
+import './Canvas.css';
+export declare const Canvas: import("react").NamedExoticComponent<object>;

package/dist/components/CanvasViewToggle.d.ts

@@ -0,0 +1,6 @@
+export declare const CanvasViewToggle: import("react").NamedExoticComponent<{
+    platform: "ios" | "android";
+    setPlatform: (p: "ios" | "android") => void;
+    darkMode: boolean;
+    setDarkMode: (d: boolean) => void;
+}>;

package/dist/components/CredentialsModal.d.ts

@@ -0,0 +1,11 @@
+interface Props {
+    onClose: () => void;
+    /** Called after credentials are saved (for Send flow) */
+    onSaved?: () => void;
+    /** Title override */
+    title?: string;
+    /** Label for the save button. Default: "Save & Continue" */
+    saveLabel?: string;
+}
+export declare const CredentialsModal: import("react").NamedExoticComponent<Props>;
+export {};

package/dist/components/EditorLayout.d.ts

@@ -0,0 +1,2 @@
+import './EditorLayout.css';
+export declare const EditorLayout: import("react").NamedExoticComponent<object>;

package/dist/components/ElementTree.d.ts

@@ -0,0 +1,2 @@
+import './ElementTree.css';
+export declare function ElementTree(): import("react/jsx-runtime").JSX.Element;

package/dist/components/LeftPanel.d.ts

@@ -0,0 +1,2 @@
+import './LeftPanel.css';
+export declare const LeftPanel: import("react").NamedExoticComponent<object>;

package/dist/components/NotificationPreview.d.ts

@@ -0,0 +1,3 @@
+export declare const NotificationPreview: import("react").NamedExoticComponent<{
+    platform: "ios" | "android";
+}>;

package/dist/components/RightPanel.d.ts

@@ -0,0 +1,2 @@
+import './RightPanel.css';
+export declare const RightPanel: import("react").NamedExoticComponent<object>;

package/dist/components/ShortcutsPanel.d.ts

@@ -0,0 +1,2 @@
+import './ShortcutsPanel.css';
+export declare const ShortcutsPanel: import("react").NamedExoticComponent<object>;

package/dist/components/TemplateLibrary.d.ts

@@ -0,0 +1,2 @@
+import './TemplateLibrary.css';
+export declare const TemplateLibrary: import("react").NamedExoticComponent<object>;

package/dist/components/TopBar.d.ts

@@ -0,0 +1,2 @@
+import './TopBar.css';
+export declare const TopBar: import("react").NamedExoticComponent<object>;

package/dist/components/properties/ActionEditor.d.ts

@@ -0,0 +1,7 @@
+import type { CardAction } from '../../types/schema';
+interface Props {
+    action: CardAction;
+    onChange: (action: CardAction) => void;
+}
+export declare const ActionEditor: import("react").NamedExoticComponent<Props>;
+export {};

package/dist/components/properties/CardStyleEditor.d.ts

@@ -0,0 +1,2 @@
+import './PropertyEditors.css';
+export declare const CardStyleEditor: import("react").NamedExoticComponent<object>;

package/dist/components/properties/ElementPropertyEditor.d.ts

@@ -0,0 +1,8 @@
+import type { CardElement } from '../../types/schema';
+import './PropertyEditors.css';
+interface Props {
+    element: CardElement;
+    onUpdate: (updates: Partial<CardElement>) => void;
+}
+export declare const ElementPropertyEditor: import("react").NamedExoticComponent<Props>;
+export {};

package/dist/components/properties/IconPicker.d.ts

@@ -0,0 +1,7 @@
+import type { IconRef } from '../../types/schema';
+interface Props {
+    value: IconRef | string | undefined;
+    onChange: (v: IconRef | undefined) => void;
+}
+export declare const IconPicker: import("react").NamedExoticComponent<Props>;
+export {};

package/dist/components/properties/NotificationEditor.d.ts

@@ -0,0 +1,2 @@
+import './PropertyEditors.css';
+export declare const NotificationEditor: import("react").NamedExoticComponent<object>;

package/dist/components/properties/VariableEditor.d.ts

@@ -0,0 +1,2 @@
+import './PropertyEditors.css';
+export declare const VariableEditor: import("react").NamedExoticComponent<object>;

package/dist/components/properties/VariableInput.d.ts

@@ -0,0 +1,10 @@
+interface VariableInputProps {
+    value: string;
+    onChange: (v: string) => void;
+    placeholder?: string;
+    multiline?: boolean;
+    rows?: number;
+    style?: React.CSSProperties;
+}
+export declare const VariableInput: import("react").NamedExoticComponent<VariableInputProps>;
+export {};

package/dist/components/renderers/ElementRenderer.d.ts

@@ -0,0 +1,20 @@
+import type { CardElement } from '../../types/schema';
+interface ElementRendererProps {
+    element: CardElement;
+    path: number[];
+    selectedPath: number[] | null;
+    selectedPaths: number[][];
+    onSelect: (path: number[] | null) => void;
+    onToggleSelect: (path: number[]) => void;
+    onMove: (path: number[], direction: 'up' | 'down') => void;
+    onRemove: (path: number[]) => void;
+    onWrap: (path: number[], wrapperType: 'row' | 'column' | 'grid') => void;
+    onUnwrap: (path: number[]) => void;
+    onDuplicate: (path: number[]) => void;
+    isFirst: boolean;
+    isLast: boolean;
+    inRow?: boolean;
+    colorMode?: 'light' | 'dark';
+}
+export declare const ElementRenderer: import("react").NamedExoticComponent<ElementRendererProps>;
+export {};

package/dist/components/ui/Button.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode, ButtonHTMLAttributes } from 'react';
+type ButtonVariant = 'primary' | 'secondary' | 'danger' | 'link';
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant;
+    children: ReactNode;
+}
+export declare const Button: import("react").NamedExoticComponent<ButtonProps>;
+export {};

package/dist/components/ui/ColorPicker.d.ts

@@ -0,0 +1,30 @@
+import type { ColorValue } from '../../types/schema';
+/**
+ * Color section with light/dark toggle header + color fields.
+ * Usage:
+ * ```
+ * <ColorSection>
+ *   {(mode) => (
+ *     <>
+ *       <ColorField label="Background" value={el.backgroundColor} onChange={(v) => onUpdate({ backgroundColor: v })} mode={mode} />
+ *       <ColorField label="Border" value={el.borderColor} onChange={(v) => onUpdate({ borderColor: v })} mode={mode} />
+ *     </>
+ *   )}
+ * </ColorSection>
+ * ```
+ */
+export declare function ColorSection({ children }: {
+    children: (mode: 'light' | 'dark') => React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Single color field: label + swatch + hex input.
+ * Respects light/dark mode to show/edit the correct side of a ColorValue.
+ */
+export declare function ColorField({ label, value, onChange, fallback, transparentValue, mode, }: {
+    label: string;
+    value: ColorValue | undefined;
+    onChange: (v: ColorValue | undefined) => void;
+    fallback?: string;
+    transparentValue?: ColorValue;
+    mode?: 'light' | 'dark';
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/EmptyState.d.ts

@@ -0,0 +1,7 @@
+interface EmptyStateProps {
+    icon: string;
+    title: string;
+    subtitle: string;
+}
+export declare const EmptyState: import("react").NamedExoticComponent<EmptyStateProps>;
+export {};

package/dist/components/ui/MaterialIcon.d.ts

@@ -0,0 +1,9 @@
+interface MaterialIconProps {
+    icon: string;
+    size?: number;
+    filled?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const MaterialIcon: import("react").NamedExoticComponent<MaterialIconProps>;
+export {};

package/dist/components/ui/Modal.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode, CSSProperties } from 'react';
+interface ModalProps {
+    title: string;
+    onClose: () => void;
+    children: ReactNode;
+    footer?: ReactNode;
+    width?: number;
+    style?: CSSProperties;
+}
+export declare const Modal: import("react").NamedExoticComponent<ModalProps>;
+export {};

package/dist/config/app-credentials.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Unified app credentials state.
+ *
+ * Priority:
+ * 1. Props (highest) — passed via mountCardBuilder → read-only, non-editable
+ * 2. User-entered — set via App Credentials modal → editable (token cannot be set here)
+ * 3. Env vars (lowest, dev only) — from .env, set via builderConfig in App.tsx
+ *
+ * Note: `token` can only come from props or env (never user-entered).
+ */
+export interface AppCredentials {
+    appId: string;
+    region: string;
+    token: string;
+    apiKey: string;
+}
+/** Initialize credentials from mount props (highest priority, read-only) */
+export declare function initCredentials(appId?: string, region?: string, token?: string, apiKey?: string): void;
+/**
+ * Get resolved credentials (props > user-entered).
+ * Each field is resolved independently — props field wins if non-empty.
+ */
+export declare function getCredentials(): AppCredentials;
+/** Whether credentials were provided via props (should be non-editable) */
+export declare function isProvidedByProps(): boolean;
+/** Whether we have enough credentials for template API calls (appId + token) */
+export declare function hasApiCredentials(): boolean;
+/** Whether we have enough credentials for sending messages (appId + region + apiKey) */
+export declare function hasSendCredentials(): boolean;
+/** Legacy: whether all credentials are configured */
+export declare function hasCredentials(): boolean;
+/** Update user-entered credentials (only works if not provided by props) */
+export declare function setCredentials(creds: Partial<AppCredentials>): void;
+/** Get user-entered credentials (for displaying in the modal) */
+export declare function getUserCredentials(): AppCredentials;
+/** Subscribe to credential changes */
+export declare function subscribeCredentials(fn: () => void): () => void;
+/** Reset credentials (used on destroy) */
+export declare function resetCredentials(): void;

package/dist/config/builder-config.d.ts

@@ -0,0 +1,56 @@
+import type { CardMessage } from '../types/schema';
+export interface CardVariable {
+    /** Variable name used in {{name}} tokens, e.g. 'user.name' */
+    name: string;
+    /** Human-readable label shown in the picker */
+    label?: string;
+    /** Short description */
+    description?: string;
+    /** Category for grouping in the picker */
+    category?: string;
+}
+export interface NotificationConfig {
+    /** App name shown in the notification preview */
+    appName?: string;
+    /** App icon URL shown in the notification preview */
+    appIcon?: string;
+    /** Show the Data key-value editor in the notification tab */
+    enableData?: boolean;
+    /** Show the push notification phone preview in the canvas. Default: true */
+    showPreview?: boolean;
+    /** Called when notification title or body changes */
+    onNotificationChange?: (notification: {
+        title: string;
+        body: string;
+    }) => void;
+    /** Called when notification data changes */
+    onNotificationDataChange?: (data: Record<string, string>) => void;
+}
+/** Which channels the builder supports */
+export type BuilderChannels = 'inapp' | 'push' | 'both';
+/** Module-level config accessible by components */
+export declare const builderConfig: {
+    appId?: string;
+    region?: string;
+    token?: string;
+    onSave?: (json: CardMessage, name: string, description: string) => void;
+    onChange?: (json: CardMessage) => void;
+    hideTopBar?: boolean;
+    hideTemplateLibrary?: boolean;
+    channels?: BuilderChannels;
+    /** Whether channels was explicitly provided by the host app (vs defaulted to 'both') */
+    channelsExplicit?: boolean;
+    /** Show the variable editor tab for creating/managing variables. Default: true */
+    enableVariableEditor?: boolean;
+    notification?: NotificationConfig;
+    /** Enable the built-in variable creation/management UI. Default: false */
+    enableVariableManager?: boolean;
+    /** Show the canvas toolbar (zoom, dark mode, preview, JSON). Default: false */
+    showCanvasToolbar?: boolean;
+    /** Hide the left panel (elements & components palette). Default: false */
+    /** Disable all editing interactions — read-only preview mode. Default: false */
+    readOnly?: boolean;
+    hideElementPalette?: boolean;
+    /** Hide the right panel (tree, element properties, card settings). Default: false */
+    hidePropertyPanel?: boolean;
+};

package/dist/config/component-templates.d.ts

@@ -0,0 +1,11 @@
+export interface ComponentTemplate {
+    name: string;
+    category: string;
+    icon: string;
+    description: string;
+    elements: Record<string, unknown>[];
+}
+export declare const COMPONENT_TEMPLATES: ComponentTemplate[];
+export declare const COMPONENT_CATEGORIES: string[];
+export declare const COMPONENT_TEMPLATE_NAMES: readonly ["Product Card", "Order Confirmation", "Announcement", "Quick Reply Buttons", "Order Tracking", "Event Card", "Feedback", "Data Table", "Carousel"];
+export type ComponentTemplateName = typeof COMPONENT_TEMPLATE_NAMES[number];

package/dist/config/element-defaults.d.ts

@@ -0,0 +1,8 @@
+import type { CardElement } from '../types/schema';
+export declare const ELEMENT_DEFAULTS: Map<string, () => CardElement>;
+export declare const ELEMENT_PALETTE: {
+    readonly Layout: readonly ["row", "column", "grid", "accordion", "tabs"];
+    readonly Content: readonly ["text", "image", "icon", "avatar", "badge", "divider", "spacer", "chip", "markdown", "codeBlock"];
+    readonly 'Data Display': readonly ["table", "progressBar"];
+    readonly Actions: readonly ["button", "iconButton", "link"];
+};

package/dist/config/icon-library.d.ts

@@ -0,0 +1,11 @@
+export interface IconEntry {
+    name: string;
+    label: string;
+    url: string;
+    category: string;
+}
+export declare const ICON_LIBRARY: IconEntry[];
+export declare const ICON_MAP: Map<string, IconEntry>;
+export declare const ICON_CATEGORIES: string[];
+/** Resolve an icon name to its URL. Returns the name as-is if it's already a URL. */
+export declare function resolveIconUrl(nameOrUrl: string): string;

package/dist/config/theme.d.ts

@@ -0,0 +1,11 @@
+import type { UIKitColorMode } from './uikit-theme';
+/** Build a flat token map from UIKit theme colors */
+export declare function buildTokensFromUIKit(colors: UIKitColorMode): Record<string, string>;
+export declare const THEME_TOKENS: Record<string, string>;
+export declare const DARK_THEME_TOKENS: Record<string, string>;
+export declare let THEME_TOKEN_NAMES: string[];
+export declare function setActiveTheme(dark: boolean): void;
+/** Sync active theme tokens from the UIKit theme store */
+export declare function syncThemeTokens(lightColors: UIKitColorMode, darkColors: UIKitColorMode, isDark: boolean): void;
+export declare function resolveColor(value: string | undefined, fallback?: string): string;
+export declare const TEXT_VARIANT_STYLES: Record<string, React.CSSProperties>;

package/dist/config/uikit-theme.d.ts

@@ -0,0 +1,73 @@
+export declare function hexToRgb(hex: string): {
+    r: number;
+    g: number;
+    b: number;
+};
+export declare function rgbToHex(r: number, g: number, b: number): string;
+export declare const SHADE_KEYS: readonly [50, 100, 200, 300, 400, 500, 600, 700, 800, 900];
+export declare function generateExtendedPrimary(primary: string): {
+    light: Record<number, string>;
+    dark: Record<number, string>;
+};
+export declare function generateSpacingScale(baseUnit?: number, steps?: number): Record<string, number>;
+export declare function generatePadding(scale: Record<string, number>): Record<string, number>;
+export declare function generateRadius(scale: Record<string, number>): Record<string, number>;
+export interface UIKitColorMode {
+    primary: string;
+    extendedPrimary: Record<number, string>;
+    neutral: Record<number, string>;
+    alert: {
+        info: string;
+        warning: string;
+        success: string;
+        error: string;
+    };
+    staticColors: {
+        black: string;
+        white: string;
+    };
+    sendBubble: {
+        background: string;
+        text: string;
+        textHighlight: string;
+        link: string;
+        timestamp: string;
+        icon: string;
+    };
+    receiveBubble: {
+        background: string;
+        text: string;
+        textHighlight: string;
+        link: string;
+        timestamp: string;
+        icon: string;
+    };
+}
+export interface UIKitTheme {
+    name: string;
+    version: string;
+    spacing: {
+        baseUnit: number;
+        scale: Record<string, number>;
+        padding: Record<string, number>;
+        radius: Record<string, number>;
+    };
+    typography: {
+        fontFamily: string;
+        scale: Record<string, {
+            size: number;
+            lineHeight: number;
+            weight?: string;
+        }>;
+        weights: {
+            bold: string;
+            medium: string;
+            regular: string;
+        };
+    };
+    colors: {
+        light: UIKitColorMode;
+        dark: UIKitColorMode;
+    };
+}
+export declare function createDefaultTheme(): UIKitTheme;

package/dist/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="48" height="46" fill="none" viewBox="0 0 48 46"><path fill="#863bff" d="M25.946 44.938c-.664.845-2.021.375-2.021-.698V33.937a2.26 2.26 0 0 0-2.262-2.262H10.287c-.92 0-1.456-1.04-.92-1.788l7.48-10.471c1.07-1.497 0-3.578-1.842-3.578H1.237c-.92 0-1.456-1.04-.92-1.788L10.013.474c.214-.297.556-.474.92-.474h28.894c.92 0 1.456 1.04.92 1.788l-7.48 10.471c-1.07 1.498 0 3.579 1.842 3.579h11.377c.943 0 1.473 1.088.89 1.83L25.947 44.94z" style="fill:#863bff;fill:color(display-p3 .5252 .23 1);fill-opacity:1"/><mask id="a" width="48" height="46" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="#000" d="M25.842 44.938c-.664.844-2.021.375-2.021-.698V33.937a2.26 2.26 0 0 0-2.262-2.262H10.183c-.92 0-1.456-1.04-.92-1.788l7.48-10.471c1.07-1.498 0-3.579-1.842-3.579H1.133c-.92 0-1.456-1.04-.92-1.787L9.91.473c.214-.297.556-.474.92-.474h28.894c.92 0 1.456 1.04.92 1.788l-7.48 10.471c-1.07 1.498 0 3.578 1.842 3.578h11.377c.943 0 1.473 1.088.89 1.832L25.843 44.94z" style="fill:#000;fill-opacity:1"/></mask><g mask="url(#a)"><g filter="url(#b)"><ellipse cx="5.508" cy="14.704" fill="#ede6ff" rx="5.508" ry="14.704" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -4.47 31.516)"/></g><g filter="url(#c)"><ellipse cx="10.399" cy="29.851" fill="#ede6ff" rx="10.399" ry="29.851" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -39.328 7.883)"/></g><g filter="url(#d)"><ellipse cx="5.508" cy="30.487" fill="#7e14ff" rx="5.508" ry="30.487" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.814 -25.913 -14.639)scale(1 -1)"/></g><g filter="url(#e)"><ellipse cx="5.508" cy="30.599" fill="#7e14ff" rx="5.508" ry="30.599" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.814 -32.644 -3.334)scale(1 -1)"/></g><g filter="url(#f)"><ellipse cx="5.508" cy="30.599" fill="#7e14ff" rx="5.508" ry="30.599" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -34.34 30.47)"/></g><g filter="url(#g)"><ellipse cx="14.072" cy="22.078" fill="#ede6ff" rx="14.072" ry="22.078" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="rotate(93.35 24.506 48.493)scale(-1 1)"/></g><g filter="url(#h)"><ellipse cx="3.47" cy="21.501" fill="#7e14ff" rx="3.47" ry="21.501" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.009 28.708 47.59)scale(-1 1)"/></g><g filter="url(#i)"><ellipse cx="3.47" cy="21.501" fill="#7e14ff" rx="3.47" ry="21.501" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.009 28.708 47.59)scale(-1 1)"/></g><g filter="url(#j)"><ellipse cx=".387" cy="8.972" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(39.51 .387 8.972)"/></g><g filter="url(#k)"><ellipse cx="47.523" cy="-6.092" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 47.523 -6.092)"/></g><g filter="url(#l)"><ellipse cx="41.412" cy="6.333" fill="#47bfff" rx="5.971" ry="9.665" style="fill:#47bfff;fill:color(display-p3 .2799 .748 1);fill-opacity:1" transform="rotate(37.892 41.412 6.333)"/></g><g filter="url(#m)"><ellipse cx="-1.879" cy="38.332" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 -1.88 38.332)"/></g><g filter="url(#n)"><ellipse cx="-1.879" cy="38.332" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 -1.88 38.332)"/></g><g filter="url(#o)"><ellipse cx="35.651" cy="29.907" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 35.651 29.907)"/></g><g filter="url(#p)"><ellipse cx="38.418" cy="32.4" fill="#47bfff" rx="5.971" ry="15.297" style="fill:#47bfff;fill:color(display-p3 .2799 .748 1);fill-opacity:1" transform="rotate(37.892 38.418 32.4)"/></g></g><defs><filter id="b" width="60.045" height="41.654" x="-19.77" y="16.149" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="c" width="90.34" height="51.437" x="-54.613" y="-7.533" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="d" width="79.355" height="29.4" x="-49.64" y="2.03" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="e" width="79.579" height="29.4" x="-45.045" y="20.029" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="f" width="79.579" height="29.4" x="-43.513" y="21.178" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="g" width="74.749" height="58.852" x="15.756" y="-17.901" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="h" width="61.377" height="25.362" x="23.548" y="2.284" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="i" width="61.377" height="25.362" x="23.548" y="2.284" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="j" width="56.045" height="63.649" x="-27.636" y="-22.853" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="k" width="54.814" height="64.646" x="20.116" y="-38.415" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="l" width="33.541" height="35.313" x="24.641" y="-11.323" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="m" width="54.814" height="64.646" x="-29.286" y="6.009" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="n" width="54.814" height="64.646" x="-29.286" y="6.009" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="o" width="54.814" height="64.646" x="8.244" y="-2.416" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="p" width="39.409" height="43.623" x="18.713" y="10.588" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter></defs></svg>

package/dist/hooks/useKeyboardShortcuts.d.ts

@@ -0,0 +1 @@
+export declare function useKeyboardShortcuts(): void;

package/dist/icons.svg

@@ -0,0 +1,24 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <symbol id="bluesky-icon" viewBox="0 0 16 17">
+    <g clip-path="url(#bluesky-clip)"><path fill="#08060d" d="M7.75 7.735c-.693-1.348-2.58-3.86-4.334-5.097-1.68-1.187-2.32-.981-2.74-.79C.188 2.065.1 2.812.1 3.251s.241 3.602.398 4.13c.52 1.744 2.367 2.333 4.07 2.145-2.495.37-4.71 1.278-1.805 4.512 3.196 3.309 4.38-.71 4.987-2.746.608 2.036 1.307 5.91 4.93 2.746 2.72-2.746.747-4.143-1.747-4.512 1.702.189 3.55-.4 4.07-2.145.156-.528.397-3.691.397-4.13s-.088-1.186-.575-1.406c-.42-.19-1.06-.395-2.741.79-1.755 1.24-3.64 3.752-4.334 5.099"/></g>
+    <defs><clipPath id="bluesky-clip"><path fill="#fff" d="M.1.85h15.3v15.3H.1z"/></clipPath></defs>
+  </symbol>
+  <symbol id="discord-icon" viewBox="0 0 20 19">
+    <path fill="#08060d" d="M16.224 3.768a14.5 14.5 0 0 0-3.67-1.153c-.158.286-.343.67-.47.976a13.5 13.5 0 0 0-4.067 0c-.128-.306-.317-.69-.476-.976A14.4 14.4 0 0 0 3.868 3.77C1.546 7.28.916 10.703 1.231 14.077a14.7 14.7 0 0 0 4.5 2.306q.545-.748.965-1.587a9.5 9.5 0 0 1-1.518-.74q.191-.14.372-.293c2.927 1.369 6.107 1.369 8.999 0q.183.152.372.294-.723.437-1.52.74.418.838.963 1.588a14.6 14.6 0 0 0 4.504-2.308c.37-3.911-.63-7.302-2.644-10.309m-9.13 8.234c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.894 0 1.614.82 1.599 1.82.001 1-.705 1.82-1.6 1.82m5.91 0c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.893 0 1.614.82 1.599 1.82 0 1-.706 1.82-1.6 1.82"/>
+  </symbol>
+  <symbol id="documentation-icon" viewBox="0 0 21 20">
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="m15.5 13.333 1.533 1.322c.645.555.967.833.967 1.178s-.322.623-.967 1.179L15.5 18.333m-3.333-5-1.534 1.322c-.644.555-.966.833-.966 1.178s.322.623.966 1.179l1.534 1.321"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M17.167 10.836v-4.32c0-1.41 0-2.117-.224-2.68-.359-.906-1.118-1.621-2.08-1.96-.599-.21-1.349-.21-2.848-.21-2.623 0-3.935 0-4.983.369-1.684.591-3.013 1.842-3.641 3.428C3 6.449 3 7.684 3 10.154v2.122c0 2.558 0 3.838.706 4.726q.306.383.713.671c.76.536 1.79.64 3.581.66"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M3 10a2.78 2.78 0 0 1 2.778-2.778c.555 0 1.209.097 1.748-.047.48-.129.854-.503.982-.982.145-.54.048-1.194.048-1.749a2.78 2.78 0 0 1 2.777-2.777"/>
+  </symbol>
+  <symbol id="github-icon" viewBox="0 0 19 19">
+    <path fill="#08060d" fill-rule="evenodd" d="M9.356 1.85C5.05 1.85 1.57 5.356 1.57 9.694a7.84 7.84 0 0 0 5.324 7.44c.387.079.528-.168.528-.376 0-.182-.013-.805-.013-1.454-2.165.467-2.616-.935-2.616-.935-.349-.91-.864-1.143-.864-1.143-.71-.48.051-.48.051-.48.787.051 1.2.805 1.2.805.695 1.194 1.817.857 2.268.649.064-.507.27-.857.49-1.052-1.728-.182-3.545-.857-3.545-3.87 0-.857.31-1.558.8-2.104-.078-.195-.349-1 .077-2.078 0 0 .657-.208 2.14.805a7.5 7.5 0 0 1 1.946-.26c.657 0 1.328.092 1.946.26 1.483-1.013 2.14-.805 2.14-.805.426 1.078.155 1.883.078 2.078.502.546.799 1.247.799 2.104 0 3.013-1.818 3.675-3.558 3.87.284.247.528.714.528 1.454 0 1.052-.012 1.896-.012 2.156 0 .208.142.455.528.377a7.84 7.84 0 0 0 5.324-7.441c.013-4.338-3.48-7.844-7.773-7.844" clip-rule="evenodd"/>
+  </symbol>
+  <symbol id="social-icon" viewBox="0 0 20 20">
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M12.5 6.667a4.167 4.167 0 1 0-8.334 0 4.167 4.167 0 0 0 8.334 0"/>
+    <path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M2.5 16.667a5.833 5.833 0 0 1 8.75-5.053m3.837.474.513 1.035c.07.144.257.282.414.309l.93.155c.596.1.736.536.307.965l-.723.73a.64.64 0 0 0-.152.531l.207.903c.164.715-.213.991-.84.618l-.872-.52a.63.63 0 0 0-.577 0l-.872.52c-.624.373-1.003.094-.84-.618l.207-.903a.64.64 0 0 0-.152-.532l-.723-.729c-.426-.43-.289-.864.306-.964l.93-.156a.64.64 0 0 0 .412-.31l.513-1.034c.28-.562.735-.562 1.012 0"/>
+  </symbol>
+  <symbol id="x-icon" viewBox="0 0 19 19">
+    <path fill="#08060d" fill-rule="evenodd" d="M1.893 1.98c.052.072 1.245 1.769 2.653 3.77l2.892 4.114c.183.261.333.48.333.486s-.068.089-.152.183l-.522.593-.765.867-3.597 4.087c-.375.426-.734.834-.798.905a1 1 0 0 0-.118.148c0 .01.236.017.664.017h.663l.729-.83c.4-.457.796-.906.879-.999a692 692 0 0 0 1.794-2.038c.034-.037.301-.34.594-.675l.551-.624.345-.392a7 7 0 0 1 .34-.374c.006 0 .93 1.306 2.052 2.903l2.084 2.965.045.063h2.275c1.87 0 2.273-.003 2.266-.021-.008-.02-1.098-1.572-3.894-5.547-2.013-2.862-2.28-3.246-2.273-3.266.008-.019.282-.332 2.085-2.38l2-2.274 1.567-1.782c.022-.028-.016-.03-.65-.03h-.674l-.3.342a871 871 0 0 1-1.782 2.025c-.067.075-.405.458-.75.852a100 100 0 0 1-.803.91c-.148.172-.299.344-.99 1.127-.304.343-.32.358-.345.327-.015-.019-.904-1.282-1.976-2.808L6.365 1.85H1.8zm1.782.91 8.078 11.294c.772 1.08 1.413 1.973 1.425 1.984.016.017.241.02 1.05.017l1.03-.004-2.694-3.766L7.796 5.75 5.722 2.852l-1.039-.004-1.039-.004z" clip-rule="evenodd"/>
+  </symbol>
+</svg>