.bc-mode-toggle{margin-bottom:1.5rem;background:#f1f5f9;border-radius:12px;gap:.5rem;width:fit-content;margin-inline:auto;padding:4px;display:flex}.bc-mode-btn{cursor:pointer;color:#64748b;background:0 0;border:none;border-radius:10px;align-items:center;gap:.4rem;padding:.55rem 1.2rem;font-size:.85rem;font-weight:600;transition:all .2s;display:flex}.bc-mode-btn.active{color:#553ffe;background:#fff;box-shadow:0 2px 8px #553ffe26}.bc-single-layout{grid-template-columns:1fr 1fr;align-items:start;gap:1.5rem;display:grid}@media (width<=768px){.bc-single-layout{grid-template-columns:1fr}}.bc-controls{flex-direction:column;gap:1rem;display:flex}.bc-control-group{flex-direction:column;gap:.35rem;display:flex}.bc-label{color:#64748b;text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:.3rem;font-size:.78rem;font-weight:600;display:flex}.bc-select{color:#1e293b;cursor:pointer;background:#fff;border:1.5px solid #e2e8f0;border-radius:8px;padding:.55rem .75rem;font-size:.88rem;transition:border-color .2s}.bc-select:focus{border-color:#553ffe;outline:none}.bc-select-sm{max-width:220px}.bc-input-row{gap:.5rem;display:flex}.bc-input{color:#1e293b;border:1.5px solid #e2e8f0;border-radius:8px;flex:1;padding:.55rem .75rem;font-size:.88rem;transition:border-color .2s}.bc-input:focus{border-color:#553ffe;outline:none}.bc-random-btn{color:#553ffe;cursor:pointer;white-space:nowrap;background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:8px;align-items:center;gap:.3rem;padding:.5rem .8rem;font-size:.8rem;font-weight:600;transition:all .2s;display:flex}.bc-random-btn:hover{color:#fff;background:#553ffe;border-color:#553ffe}.bc-control-row{flex-wrap:wrap;gap:.75rem;display:flex}.bc-half{flex:1;min-width:120px}.bc-third{flex:1;min-width:100px}.bc-color-wrap{background:#fff;border:1.5px solid #e2e8f0;border-radius:8px;align-items:center;gap:.5rem;padding:.3rem .5rem;display:flex}.bc-color-input{cursor:pointer;border:none;border-radius:6px;width:28px;height:28px;padding:0}.bc-color-hex{color:#64748b;font-family:JetBrains Mono,monospace;font-size:.8rem}.bc-range{accent-color:#553ffe;width:100%}.bc-range-val{color:#94a3b8;text-align:center;font-size:.75rem}.bc-checkbox{color:#475569;cursor:pointer;align-items:center;gap:.4rem;font-size:.85rem;display:flex}.bc-checkbox input[type=checkbox]{accent-color:#553ffe}.bc-preview-panel{flex-direction:column;gap:1rem;display:flex}.bc-main-preview{background:#fff;border:2px dashed #e2e8f0;border-radius:12px;justify-content:center;align-items:center;min-height:200px;padding:2rem 1.5rem;transition:border-color .3s;display:flex}.bc-main-preview:has(.bc-svg){border-style:solid;border-color:#e2e8f0}.bc-svg{max-width:100%;height:auto}.bc-empty{color:#94a3b8;text-align:center;padding:2rem;font-size:.9rem}.bc-error{color:#ef4444;text-align:center;background:#ef44440d;border-radius:8px;padding:1rem;font-size:.85rem}.bc-download-row{gap:.5rem;display:flex}.bc-dl-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#553ffe,#7c5dfa);border:none;border-radius:10px;flex:1;justify-content:center;align-items:center;gap:.4rem;padding:.6rem 1rem;font-size:.85rem;font-weight:600;transition:all .2s;display:flex}.bc-dl-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #553ffe4d}.bc-dl-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.bc-dl-svg{background:linear-gradient(135deg,#1e293b,#334155)}.bc-bulk-layout{flex-direction:column;gap:1.5rem;display:flex}.bc-bulk-input-area{flex-direction:column;gap:.75rem;display:flex}.bc-bulk-textarea{color:#1e293b;resize:vertical;border:1.5px solid #e2e8f0;border-radius:10px;min-height:120px;padding:.75rem;font-family:JetBrains Mono,monospace;font-size:.85rem;transition:border-color .2s}.bc-bulk-textarea:focus{border-color:#553ffe;outline:none}.bc-bulk-actions{flex-wrap:wrap;gap:.75rem;display:flex}.bc-bulk-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;display:grid}.bc-bulk-item{background:#fff;border:1px solid #e2e8f0;border-radius:10px;justify-content:center;align-items:center;padding:1rem;transition:box-shadow .2s;display:flex}.bc-bulk-item:hover{box-shadow:0 4px 12px #00000014}@media (width<=480px){.bc-bulk-grid{grid-template-columns:1fr}.bc-control-row{flex-direction:column}}