.cb{display:flex;flex-direction:column;gap:20px}.cb__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:20px;align-items:start}.cb__inputs{gap:22px;padding:24px}.cb__fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px}.cb__fields--tight{align-items:end}.cb__root{max-width:calc(50% - 8px)}.cb__mono{font-family:var(--font-mono)}.cb__result{display:flex;flex-direction:column;gap:16px;min-width:0}.cb__hotkey{font-size:11px;color:var(--fg-faint)}.cb__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.cb__warn{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px 10px;padding:12px 14px;border-radius:var(--radius);border:1px solid color-mix(in oklab,var(--warning) 35%,transparent);background:color-mix(in oklab,var(--warning) 8%,transparent);font-size:var(--text-sm);line-height:1.6}.cb__empty,.cb__warn{color:var(--fg-muted)}.cb__empty{padding:28px 8px;text-align:center}@media (max-width:960px){.cb__grid{grid-template-columns:minmax(0,1fr)}.cb__result{position:static}}@media (max-width:520px){.cb__fields{gap:18px 12px}.cb__stats{grid-template-columns:minmax(0,1fr)}.cb__root{max-width:none}}.cbg{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair;user-select:none}.cbg text{font-family:var(--font-mono);font-size:11px;fill:var(--fg-faint)}.cbg__grid line{stroke:var(--line-strong);stroke-width:1;stroke-dasharray:3 5}.cbg__grid .cbg__axis{stroke-dasharray:none;stroke:var(--line-strong)}.cbg__ticks text{fill:var(--fg-muted)}.cbg .cbg__seg{fill:var(--fg-faint);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase}.cbg__line{fill:none;stroke-linecap:round;stroke-width:3}.cbg__line--flat{stroke:var(--fg-faint)}.cbg__line--ramp{stroke:var(--accent);stroke-width:3.5;filter:drop-shadow(0 0 6px var(--accent-soft))}.cbg__marker{cursor:ew-resize;outline:none}.cbg__mline{stroke:var(--accent-fg);stroke-width:1.5}.cbg__halo{fill:var(--accent-soft);transition:r var(--dur-2) var(--ease-spring)}.cbg__dot{stroke:var(--bg);stroke-width:3}.cbg__dot,.cbg__tag{fill:var(--accent)}.cbg .cbg__tagtext{fill:var(--accent-ink);font-weight:700;font-size:11px}.cbg__marker:focus-visible .cbg__halo{r:20;stroke:var(--accent-fg);stroke-width:2}.cbg__marker:hover .cbg__halo{r:18}.cbp{display:flex;flex-direction:column;gap:10px;margin-top:4px}.cbp__stage{display:flex;align-items:center;min-height:128px;padding:18px;border-radius:var(--radius);border:1px dashed var(--line-strong);background:var(--surface);overflow:hidden}.cbp__text{margin:0;width:100%;font-weight:700;letter-spacing:var(--tracking-tight);line-height:1.15;overflow-wrap:anywhere}.cbp__outer{width:100%;background:color-mix(in oklab,var(--accent) 18%,transparent);border:1px solid color-mix(in oklab,var(--accent) 50%,transparent);border-radius:var(--radius-s)}.cbp__frame{width:100%;background:color-mix(in oklab,var(--accent) 12%,transparent);border:1px dashed color-mix(in oklab,var(--accent) 55%,transparent);border-radius:var(--radius-s)}.cbp__inner{display:grid;place-items:center;min-height:36px;min-width:0;padding:4px 10px;border-radius:6px;background:var(--accent);color:var(--accent-ink);font-size:12px;font-weight:700}.cbp__row{display:flex;width:100%}.cbp__row .cbp__inner{flex:1}.cbp__bar{min-width:40px;max-width:100%;padding:10px 12px;border-radius:8px;background:var(--accent);color:var(--accent-ink);font-size:12px;font-weight:700;font-family:var(--font-mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cbp__readout{font-size:var(--text-xs);color:var(--fg-muted)}.cbp__readout code{padding:.1em .4em;border-radius:6px;background:var(--surface-2);color:var(--fg);font-family:var(--font-mono)}@media (min-width:961px) and (min-height:1040px){.cb__result{position:sticky;top:80px}}.cb__result{position:sticky;top:80px}@media (max-width:960px){.cb__result{position:static}}.cb__viz{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:24px;align-items:center}@media (max-width:860px){.cb__viz{grid-template-columns:minmax(0,1fr)}}