.cbg-wrap{display:flex;flex-direction:column;gap:1.1rem}.cbg-section-label{font-size:.78rem;font-weight:700;color:var(--color-primary);text-transform:uppercase;letter-spacing:.04em}.cbg-presets{display:flex;flex-direction:column;gap:.55rem}.cbg-preset-btns{display:flex;flex-wrap:wrap;gap:.4rem}.cbg-preset{min-height:32px;padding:.32rem .78rem;background:var(--color-surface-muted);color:var(--color-text-secondary);border:0;border-radius:var(--radius-pill);cursor:pointer;font-size:.82rem;font-weight:700;box-shadow:inset 0 0 0 1px var(--color-border-soft);transition:background-color var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast)}@media(hover:hover){.cbg-preset:hover{color:var(--color-primary);background:var(--color-surface);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--color-primary) 45%,transparent)}}.cbg-preset:active{transform:scale(.96)}.cbg-preset--active{background:var(--color-primary-light);color:var(--color-primary);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--color-primary) 60%,transparent)}.cbg-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem}.cbg-card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card),inset 0 0 0 1px var(--color-border-soft);padding:.95rem 1rem 1.05rem;display:flex;flex-direction:column;gap:.65rem}.cbg-card-head{display:flex;justify-content:space-between;align-items:center}.cbg-canvas-wrap{display:flex;flex-direction:column;gap:.5rem}.cbg-canvas{width:100%;aspect-ratio:1 / 1;color:var(--color-primary);background:var(--color-bg-secondary);border-radius:var(--radius-md);box-shadow:inset 0 0 0 1px var(--color-border-soft);touch-action:none;overflow:visible}.cbg-curve{stroke:var(--color-primary);transition:d .06s linear}.cbg-handle{fill:var(--color-primary);stroke:var(--color-bg);stroke-width:2;cursor:grab;transition:r .12s ease,fill .12s ease}.cbg-handle:hover{r:11}.cbg-handle--active{cursor:grabbing;r:11;fill:var(--color-primary-hover)}.cbg-anchor{fill:var(--color-text-muted)}.cbg-hint{font-size:.78rem;color:var(--color-text-muted);margin:0}.cbg-preview{display:flex;flex-direction:column;gap:.85rem;flex:1}.cbg-track{position:relative;width:100%;height:90px;background:var(--color-bg-secondary);border-radius:var(--radius-md);box-shadow:inset 0 0 0 1px var(--color-border-soft);overflow:hidden;display:flex;align-items:center;padding:0 1rem}.cbg-ball{width:36px;height:36px;border-radius:50%;background:var(--color-primary);box-shadow:0 2px 6px #4b362138,inset 0 1px #fff3;transform:translate(0);flex-shrink:0}.cbg-preview-controls{display:flex;flex-direction:column;gap:.45rem}.cbg-duration-row{display:flex;align-items:center;gap:.5rem}.cbg-duration{max-width:130px}.cbg-unit{font-size:.85rem;color:var(--color-text-muted)}.cbg-action-row{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap}.cbg-play{min-width:96px}.cbg-loop-toggle{display:inline-flex;align-items:center;gap:.35rem;font-size:.85rem;color:var(--color-text-secondary);cursor:pointer}.cbg-loop-toggle input{accent-color:var(--color-primary)}.cbg-numbers{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.85rem}.cbg-num-group{display:flex;flex-direction:column;gap:.4rem;padding:.65rem .85rem;background:var(--color-bg-secondary);border-radius:var(--radius-md);box-shadow:inset 0 0 0 1px var(--color-border-soft)}.cbg-num-row{display:flex;gap:.6rem}.cbg-num-label{flex:1;display:flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;color:var(--color-text-secondary)}.cbg-num{flex:1;min-width:0}.cbg-output{display:flex;flex-direction:column;gap:.6rem}.cbg-output-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem}.cbg-format-tabs{display:inline-flex;gap:.3rem;padding:.18rem;background:var(--color-bg-secondary);border-radius:var(--radius-pill);box-shadow:inset 0 0 0 1px var(--color-border-soft)}.cbg-format{min-height:28px;padding:.2rem .85rem;background:transparent;color:var(--color-text-secondary);border:0;border-radius:var(--radius-pill);cursor:pointer;font-size:.78rem;font-weight:700;transition:background-color var(--transition-fast),color var(--transition-fast)}.cbg-format--active{background:var(--color-surface);color:var(--color-primary);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--color-primary) 45%,transparent)}.cbg-output-pre{margin:0;padding:.85rem 1rem;background:var(--color-bg-secondary);border-radius:var(--radius-md);box-shadow:inset 0 0 0 1px var(--color-border-soft);font-family:var(--font-mono);font-size:.85rem;color:var(--color-text);overflow:auto}.cbg-output-pre code{background:transparent;color:inherit;font-family:inherit;white-space:pre-wrap;overflow-wrap:anywhere}.cbg-output-actions{display:flex;align-items:center;gap:.85rem}@media(max-width:720px){.cbg-main,.cbg-numbers{grid-template-columns:minmax(0,1fr)}.cbg-track{height:80px}.cbg-ball{width:32px;height:32px}}