:root { color-scheme: dark; }
* { box-sizing: border-box; }
html, body { margin: 0; }
.dl-title { font-family: ui-monospace, "Cascadia Mono", Menlo, monospace; letter-spacing: -.02em; }
.dl-link { background: none; border: none; color: #6ee7b7; cursor: pointer; padding: 0; font-size: 12px; }
.dl-swatch { width: 100%; height: 34px; background: transparent; border: 1px solid hsl(var(--border, 240 5% 18%)); border-radius: 6px; cursor: pointer; padding: 2px; }
.dl-curve { display: block; width: 100%; aspect-ratio: 16/10; background: hsl(var(--card, 240 6% 8%)); cursor: crosshair; touch-action: none; }
.dl-canvas { max-width: 100%; max-height: 100%; image-rendering: pixelated; border-radius: 6px; background: #000; }
.dl-cutlabel { font-size: 11px; color: hsl(var(--muted-foreground, 240 5% 65%)); padding: 4px 2px 0; }
/* clear, on-brand active state for segmented groups + tabs (lbk-ditherland's --accent is too subtle) */
.dl-grpbtn[data-state=on] { background: #6ee7b7; color: #06120e; border-color: #6ee7b7; font-weight: 600; }
#tab-image[data-state=active], #tab-video[data-state=active], #tab-gen[data-state=active] { background: #6ee7b7; color: #06120e; }
/* progress fill in the LBK accent instead of lbk-ditherland's grey */
.slider-progress { background-color: #6ee7b7 !important; }