.cbs-wrap{display:flex;flex-direction:column;gap:.6rem;min-width:0;min-height:0;position:relative}.cbs-wrap.is-dragging:after{content:"";position:absolute;inset:-6px;border-radius:var(--radius-lg);box-shadow:inset 0 0 0 2px color-mix(in oklch,var(--color-primary) 70%,transparent);background:color-mix(in oklch,var(--color-primary) 6%,transparent);pointer-events:none}.cbs-control{display:flex;align-items:center;gap:.4rem;min-width:0}.cbs-control .tool-label{margin:0}.cbs-capture-action:has(#cbs-capture[hidden]){display:none}.cbs-export-help{font-size:.8rem;color:var(--color-text-muted)}.cbs-tabs{gap:.35rem;padding:.3rem;background:var(--color-surface-muted);width:fit-content}.cbs-tab{padding:.42rem 1.1rem;border:0;border-radius:var(--radius-pill);background:transparent;color:var(--color-text-muted);font-size:.85rem;font-weight:700;cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast)}.cbs-tab[aria-pressed=true]{background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-subtle)}@media(hover:hover){.cbs-tab[aria-pressed=false]:hover{color:var(--color-text-secondary)}}.cbs-panel{display:flex;flex-direction:column;gap:.5rem}.cbs-panel[hidden]{display:none}.cbs-drop{display:flex;flex-direction:column;gap:.6rem;padding:.65rem .8rem;border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:inset 0 0 0 2px var(--color-border-soft);cursor:pointer}.cbs-actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.cbs-actions [hidden]{display:none}.cbs-hint{margin:0;font-size:.8rem;line-height:1.45;color:var(--color-text-muted)}.cbs-file{display:none}.cbs-image-note{height:2.9em;overflow:auto;font-size:.8rem;line-height:1.45}.cbs-wrap:has(#cbs-image-panel[hidden])>.cbs-image-note{display:none}.cbs-imginfo{margin:0;font-size:.8rem;line-height:1.45;color:var(--color-text-secondary);overflow-wrap:anywhere}.cbs-imginfo[hidden]{display:none}.cbs-colors{height:7.5rem;min-height:7.5rem;resize:none;font-family:var(--font-mono)}.cbs-controls{display:flex;flex-wrap:wrap;gap:.6rem 1.25rem;align-items:center}.cbs-ctl-label{font-size:.82rem;font-weight:700;color:var(--color-text-secondary)}.cbs-severity{display:flex;align-items:center;gap:.55rem;font-size:.85rem}.cbs-wrap .cbs-severity input[type=range]{flex:0 0 160px;width:160px;min-height:24px}.cbs-severity output{font-family:var(--font-mono);font-weight:700;color:var(--color-text);min-width:2.5ch}.cbs-viewctl{display:flex;flex-wrap:wrap;gap:.5rem .9rem;align-items:center}.cbs-viewctl[hidden]{display:none}.cbs-seg{padding:.2rem;gap:.2rem;background:var(--color-surface-muted)}.cbs-seg-btn{border:0;padding:.3rem .8rem;border-radius:var(--radius-pill);background:transparent;color:var(--color-text-muted);font-size:.8rem;font-weight:700;cursor:pointer}.cbs-seg-btn[aria-pressed=true]{background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-subtle)}.cbs-compare-type{display:flex;align-items:center;gap:.5rem}.cbs-compare-type[hidden]{display:none}.cbs-select{min-height:32px}.cbs-status{margin:0;height:3em;flex:none;overflow:auto;overflow-wrap:anywhere;font-size:.84rem;line-height:1.5;color:var(--color-text-secondary)}.cbs-status.is-error{color:var(--color-danger)}.cbs-status.is-warn{color:var(--color-text);font-weight:600}.cbs-grid,.cbs-compare,.cbs-table-wrap{flex:1 1 0;min-width:0;min-height:300px;overflow:auto;scrollbar-gutter:stable;overscroll-behavior:contain}.cbs-grid,.cbs-compare{align-content:start;grid-auto-rows:max-content}.cbs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.cbs-grid[hidden],.cbs-compare[hidden]{display:none}.cbs-card,.cbs-compare-fig{margin:0;display:flex;flex-direction:column;border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-border-soft),var(--shadow-card);overflow:hidden}.cbs-card-original{box-shadow:inset 0 0 0 2px color-mix(in oklch,var(--color-primary) 50%,transparent),var(--shadow-card)}.cbs-card-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:.2rem .5rem;padding:.55rem .75rem .45rem}.cbs-card-label{font-size:.82rem;font-weight:800;color:var(--color-text);line-height:1.25}.cbs-card-sub{font-size:.72rem;color:var(--color-text-muted);line-height:1.25}.cbs-card-canvas,.cbs-compare-canvas{display:block;width:100%;height:auto;background:repeating-conic-gradient(var(--color-surface-muted) 0% 25%,var(--color-surface) 0% 50%) 50% / 16px 16px}.cbs-card .cbs-dl{margin:.45rem .6rem .55rem;align-self:flex-start}.cbs-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.cbs-compare-fig .cbs-card-head{align-items:center}.cbs-compare-fig .cbs-dl{margin-left:auto}.cbs-table-wrap{overflow-x:auto;border-radius:var(--radius-md);box-shadow:inset 0 0 0 1px var(--color-border-soft)}.cbs-table-wrap[hidden]{display:none}.cbs-table{border-collapse:collapse;width:100%;font-size:.8rem}.cbs-table th,.cbs-table td{padding:.4rem .45rem;text-align:left;vertical-align:middle;border-bottom:1px solid var(--color-border-soft)}.cbs-table thead th{font-weight:800;color:var(--color-text-secondary);white-space:nowrap}.cbs-th-color{max-width:9rem;overflow:hidden;text-overflow:ellipsis}.cbs-row-head{white-space:nowrap}.cbs-row-label{display:block;font-weight:800;color:var(--color-text)}.cbs-row-sub{display:block;font-size:.7rem;font-weight:400;color:var(--color-text-muted)}.cbs-row-normal th,.cbs-row-normal td{background:var(--color-surface-muted)}.cbs-swatch{display:block;min-width:5.6rem;min-height:2.4rem;padding:0 .45rem;border:0;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.74rem;font-weight:700;cursor:pointer;box-shadow:inset 0 0 0 1px #0000001f}.cbs-td-pair{min-width:13rem}.cbs-badge{display:inline-block;margin-right:.4rem;padding:.1rem .45rem;border-radius:var(--radius-pill);font-size:.72rem;font-weight:800;white-space:nowrap;background:var(--color-surface-muted);color:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-border-soft)}.cbs-badge.is-same{box-shadow:inset 0 0 0 2px var(--color-text)}.cbs-badge.is-close{box-shadow:inset 0 0 0 1px var(--color-text-secondary)}.cbs-badge.is-ok{color:var(--color-text-muted)}.cbs-pair-text{color:var(--color-text-secondary)}@media(min-width:861px){.cbs-wrap:has(#cbs-table-wrap[hidden]) #cbs-colors-panel{flex:1;min-height:0}.cbs-wrap:has(#cbs-table-wrap[hidden]) .cbs-colors{flex:1;height:auto;min-height:220px}}@media(max-width:860px){.cbs-grid,.cbs-compare,.cbs-table-wrap{flex:none;height:28rem;min-height:0}.cbs-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.cbs-grid{gap:.55rem}.cbs-card-head{padding:.45rem .55rem .35rem}.cbs-card-sub{display:none}.cbs-card .cbs-dl{margin:.35rem .5rem .45rem}.cbs-compare{grid-template-columns:1fr}.cbs-tab{min-height:44px}.cbs-seg-btn{min-height:32px}.cbs-wrap .cbs-severity input[type=range]{flex-basis:130px;width:130px}.cbs-select{min-height:44px}.cbs-hint{font-size:.78rem}.cbs-image-note{height:4.35em}.cbs-status{height:4.5em}.cbs-controls,.cbs-viewctl{gap:.5rem}.cbs-severity{gap:.4rem}.tool-widget .cbs-actions .btn-primary,.tool-widget .cbs-actions .btn-secondary,.tool-widget .cbs-actions .btn-ghost{flex:0 1 auto;padding:.6rem .7rem}.cbs-drop{padding:.5rem}}