.cb-page{max-width:1400px;margin:0 auto;padding:0 1rem 3rem}.cb-header{background:linear-gradient(135deg,#22d3ee14,#a78bfa14);border:1px solid rgba(34,211,238,.15);border-radius:var(--radius-lg);padding:2.5rem 2rem;margin-bottom:1.5rem;text-align:center}.cb-header h1{font-family:var(--font-display);font-size:2rem;margin:0 0 .5rem;background:linear-gradient(135deg,var(--color-accent),var(--color-accent-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.cb-header h1 i{-webkit-text-fill-color:var(--color-accent);margin-right:.5rem}.cb-header p{color:var(--color-text-muted);margin:0;max-width:600px;margin-inline:auto}.cb-webhook-bar{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1rem;margin-bottom:1.5rem}.cb-webhook-main{display:flex;gap:.75rem;align-items:center}.cb-webhook-url-group{flex:1;display:flex;align-items:center;gap:.75rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:0 .75rem}.cb-webhook-url-group i{color:var(--color-text-muted);font-size:.875rem}.cb-webhook-url-group input{border:none;background:transparent;padding:.75rem 0;flex:1}.cb-webhook-url-group input:focus{outline:none;box-shadow:none}.cb-webhook-extras{margin-top:.75rem}.cb-webhook-extras summary{color:var(--color-text-muted);font-size:.875rem;cursor:pointer;padding:.5rem 0;user-select:none}.cb-webhook-extras summary:hover{color:var(--color-text)}.cb-webhook-extras-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:.5rem}.cb-workspace{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1.5rem;align-items:start}.cb-editor{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden}.cb-editor-toolbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--color-border);background:var(--color-bg-elevated)}.cb-editor-toolbar h2{font-size:1rem;margin:0;display:flex;align-items:center;gap:.5rem}.cb-editor-toolbar h2 i{color:var(--color-accent);font-size:.875rem}.cb-editor-actions{display:flex;gap:.5rem}.cb-components-list{padding:1rem;max-height:70vh;overflow-y:auto}.cb-empty-state{text-align:center;padding:3rem 1rem;color:var(--color-text-muted)}.cb-empty-state i{font-size:2.5rem;margin-bottom:1rem;opacity:.3;display:block}.cb-empty-state p{font-weight:600;margin:0 0 .25rem;color:var(--color-text);font-size:1.1rem}.cb-empty-state span{font-size:.875rem}.cb-comp{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);margin-bottom:.75rem;transition:box-shadow var(--transition-fast),border-color var(--transition-fast);overflow:hidden}.cb-comp:last-child{margin-bottom:0}.cb-comp:hover{border-color:#22d3ee4d}.cb-comp-nested{margin:.5rem 0}.cb-comp-bar{display:flex;justify-content:space-between;align-items:center;padding:.625rem .75rem;background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border);border-left:3px solid var(--color-accent);gap:.5rem;flex-wrap:wrap}.cb-comp-bar-left{display:flex;align-items:center;gap:.5rem;min-width:0}.cb-comp-bar-right{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.cb-comp-drag{display:flex;flex-direction:column;gap:1px}.cb-comp-label{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.875rem;white-space:nowrap}.cb-comp-label i{color:var(--color-accent);font-size:.8rem}.cb-comp-label-sm{font-size:.8125rem}.cb-comp-fields{padding:.75rem}.cb-children{min-height:2rem;padding:.25rem 0}.cb-input{width:100%;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:.5rem .75rem;color:var(--color-text);font-size:.875rem;transition:border-color var(--transition-fast)}.cb-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 2px #22d3ee26}.cb-textarea{resize:vertical;font-family:inherit;min-height:60px}.cb-input-file{font-size:.8125rem;padding:.375rem}.cb-input-file::file-selector-button{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:4px;color:var(--color-text);padding:.25rem .5rem;margin-right:.5rem;cursor:pointer;font-size:.75rem}.cb-field{display:flex;flex-direction:column;gap:.25rem}.cb-field label{font-size:.75rem;color:var(--color-text-muted);font-weight:500;text-transform:uppercase;letter-spacing:.03em}.cb-field-grow{flex:1;min-width:0}.cb-field-row{display:flex;gap:.75rem;align-items:end;margin-bottom:.5rem}.cb-field-row:last-child{margin-bottom:0}.cb-check-label{display:flex;align-items:center;gap:.375rem;font-size:.8125rem;color:var(--color-text-muted);cursor:pointer;white-space:nowrap;user-select:none}.cb-check-label input[type=checkbox]{accent-color:var(--color-accent)}.cb-image-preview{margin-top:.5rem}.cb-image-preview img{max-width:160px;max-height:100px;border-radius:var(--radius-sm);border:1px solid var(--color-border)}.cb-btn{display:inline-flex;align-items:center;gap:.375rem;padding:.5rem 1rem;border-radius:var(--radius-sm);font-size:.875rem;font-weight:500;cursor:pointer;border:1px solid transparent;transition:all var(--transition-fast);white-space:nowrap}.cb-btn-sm{padding:.3rem .6rem;font-size:.8125rem}.cb-btn-accent{background:var(--color-accent);color:#000}.cb-btn-accent:hover{background:#06b6d4}.cb-btn-ghost{background:transparent;color:var(--color-text-muted);border:1px solid var(--color-border)}.cb-btn-ghost:hover{background:var(--color-bg-elevated);color:var(--color-text);border-color:var(--color-text-muted)}.cb-btn-send{background:#5865f2;color:#fff;padding:.75rem 1.25rem;font-weight:600;border-radius:var(--radius-sm)}.cb-btn-send:hover{background:#4752c4}.cb-btn-send:disabled{opacity:.6;cursor:not-allowed}.cb-icon-btn{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--color-border);border-radius:4px;color:var(--color-text-muted);cursor:pointer;transition:all var(--transition-fast);font-size:.7rem;padding:0}.cb-icon-btn:hover{background:var(--color-bg-elevated);color:var(--color-text);border-color:var(--color-text-muted)}.cb-icon-btn-danger:hover{color:#ef4444;border-color:#ef4444;background:#ef44441a}.cb-preview-panel{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;position:sticky;top:5rem}.cb-preview-header{padding:1rem 1.25rem;border-bottom:1px solid var(--color-border);background:var(--color-bg-elevated)}.cb-preview-header h2{font-size:1rem;margin:0;display:flex;align-items:center;gap:.5rem}.cb-preview-header h2 i{color:var(--color-accent);font-size:.875rem}.cb-preview-canvas{padding:1rem;max-height:70vh;overflow-y:auto;background:#313338}.cb-discord-msg{display:flex;gap:1rem;padding:.5rem}.cb-discord-avatar{width:40px;height:40px;border-radius:50%;background:#5865f2;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;font-size:1.1rem}.cb-discord-body{flex:1;min-width:0}.cb-discord-meta{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.cb-discord-username{font-weight:600;color:#fff;font-size:.9375rem}.cb-discord-badge{background:#5865f2;color:#fff;font-size:.6rem;font-weight:700;padding:.1rem .3rem;border-radius:3px;text-transform:uppercase;letter-spacing:.02em}.cb-discord-time{color:#949ba4;font-size:.75rem}.cb-discord-components{margin-top:.25rem}.cb-preview-empty{color:#949ba4;font-style:italic;font-size:.875rem;padding:1rem 0}.dp-text{color:#dbdee1;margin:4px 0;line-height:1.375;white-space:pre-wrap;font-size:.9375rem}.dp-action-row{display:flex;gap:8px;margin:4px 0;flex-wrap:wrap}.dp-button{display:inline-flex;align-items:center;gap:6px;padding:2px 16px;border-radius:4px;font-size:14px;font-weight:500;min-height:32px;cursor:default;transition:background .15s}.dp-button-link{background:transparent;color:#00a8fc;border:none}.dp-button-link:hover{background:#00a8fc1a}.dp-btn-disabled{opacity:.5;cursor:not-allowed}.dp-container{border-left:4px solid #4f545c;background:#1e1f2299;padding:12px;border-radius:8px;margin:8px 0}.dp-section{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:4px 0}.dp-section-content{flex:1;min-width:0}.dp-thumbnail{width:80px;height:80px;border-radius:8px;object-fit:cover;flex-shrink:0}.dp-media-gallery{display:grid;gap:4px;margin:8px 0;max-width:400px;border-radius:8px;overflow:hidden}.dp-media-item{max-width:100%;max-height:300px;object-fit:contain;display:block}.dp-file{display:flex;align-items:center;gap:12px;background:#2b2d31;border:1px solid #1e1f22;border-radius:8px;padding:10px 12px;margin:8px 0;max-width:400px}.dp-file-icon{width:36px;height:36px;background:#5865f2;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.dp-file-name{color:#00a8fc;font-size:.875rem;font-weight:500}.dp-file-size{color:#949ba4;font-size:.75rem}.dp-separator{margin:8px 0}.dp-separator-line{height:1px;background:#3f4147}.cb-modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(4px);opacity:0;transition:opacity .2s}.cb-modal-overlay.visible{opacity:1}.cb-modal{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:90%;max-width:440px;max-height:85vh;overflow-y:auto;box-shadow:0 25px 50px #00000080;transform:scale(.95);transition:transform .2s}.cb-modal-overlay.visible .cb-modal{transform:scale(1)}.cb-modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;border-bottom:1px solid var(--color-border)}.cb-modal-header h3{margin:0;font-size:1.1rem}.cb-modal-close{background:transparent;border:none;color:var(--color-text-muted);cursor:pointer;font-size:1.1rem;padding:.25rem;border-radius:4px}.cb-modal-close:hover{color:var(--color-text);background:var(--color-bg-elevated)}.cb-modal-body{padding:.75rem}.cb-component-pick{display:flex;align-items:center;gap:.875rem;width:100%;padding:.75rem 1rem;background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast);text-align:left}.cb-component-pick:hover{background:var(--color-bg-elevated);border-color:var(--color-border)}.cb-component-pick-icon{width:36px;height:36px;border-radius:8px;background:#22d3ee1a;color:var(--color-accent);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.9rem}.cb-component-pick:hover .cb-component-pick-icon{background:#22d3ee33}.cb-component-pick-info{flex:1;min-width:0}.cb-component-pick-name{display:block;font-weight:600;font-size:.9rem}.cb-component-pick-desc{display:block;font-size:.75rem;color:var(--color-text-muted);margin-top:.125rem}.cb-component-pick-arrow{color:var(--color-text-muted);font-size:.7rem;opacity:0;transition:opacity var(--transition-fast)}.cb-component-pick:hover .cb-component-pick-arrow{opacity:1}.cb-export-section{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:1.5rem}.cb-export-details summary{padding:1rem 1.25rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.5rem;user-select:none}.cb-export-details summary i{color:var(--color-accent)}.cb-export-details summary:hover{background:var(--color-bg-elevated)}.cb-export-body{padding:0 1.25rem 1.25rem}.cb-export-tabs{display:flex;gap:.25rem;margin-bottom:.75rem}.cb-export-tab{padding:.4rem .75rem;background:transparent;border:1px solid var(--color-border);border-radius:4px;color:var(--color-text-muted);cursor:pointer;font-size:.8125rem;transition:all var(--transition-fast)}.cb-export-tab:hover{color:var(--color-text);border-color:var(--color-text-muted)}.cb-export-tab.active{background:var(--color-accent);color:#000;border-color:var(--color-accent);font-weight:600}.cb-code-block{position:relative;background:#1e1e2e;border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden}.cb-code-block pre{padding:1rem;margin:0;max-height:300px;overflow:auto;font-size:.8125rem;line-height:1.5;color:#cdd6f4;font-family:Fira Code,Cascadia Code,monospace}.cb-copy-code{position:absolute;top:.5rem;right:.5rem;font-size:.75rem;padding:.3rem .6rem}.cb-faq-section{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1.5rem}.cb-faq-section h2{margin:0 0 1rem;font-size:1.25rem}.cb-faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.cb-faq{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden;transition:border-color var(--transition-fast)}.cb-faq:hover{border-color:#22d3ee4d}.cb-faq summary{padding:.875rem 1rem;font-weight:600;font-size:.875rem;cursor:pointer;user-select:none}.cb-faq p{padding:0 1rem 1rem;margin:0;font-size:.8125rem;color:var(--color-text-muted);line-height:1.6}.cb-components-list::-webkit-scrollbar,.cb-preview-canvas::-webkit-scrollbar{width:6px}.cb-components-list::-webkit-scrollbar-track,.cb-preview-canvas::-webkit-scrollbar-track{background:transparent}.cb-components-list::-webkit-scrollbar-thumb,.cb-preview-canvas::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}.cb-components-list::-webkit-scrollbar-thumb:hover,.cb-preview-canvas::-webkit-scrollbar-thumb:hover{background:#fff3}@media(max-width:1024px){.cb-workspace{grid-template-columns:1fr}.cb-preview-panel{position:static}.cb-faq-grid{grid-template-columns:1fr}}@media(max-width:640px){.cb-header{padding:1.5rem 1rem}.cb-header h1{font-size:1.5rem}.cb-webhook-main{flex-direction:column}.cb-webhook-extras-grid{grid-template-columns:1fr}.cb-comp-bar{flex-direction:column;align-items:stretch;gap:.5rem}.cb-comp-bar-right{justify-content:flex-end}.cb-field-row{flex-direction:column}.cb-field-row .cb-field{width:100%}}.cb-muted{color:var(--color-text-muted);font-style:italic;font-size:.875rem}