:where(.lab-demo){--lab-border-rgb: 170, 190, 255;--lab-text-rgb: 220, 230, 255;--lab-label-rgb: 225, 234, 255;--lab-bright-rgb: 245, 248, 255;--lab-cyan-rgb: 125, 211, 252;--lab-lilac-rgb: 196, 181, 253;--lab-blue-rgb: 59, 130, 246;--lab-violet-rgb: 139, 92, 246;--lab-surface-rgb: 5, 8, 18;--lab-input-rgb: 10, 14, 32;--lab-stage-background: #03060e;--lab-card-background: radial-gradient( circle at top left, rgba(90, 120, 255, .1), transparent 38% ), rgba(var(--lab-surface-rgb), .72);--lab-eyebrow-color: rgba(140, 170, 255, .78);--lab-control-row-margin: .4rem 0 .7rem;--lab-control-row-font-size: .9rem;--lab-slider-label-margin: .55rem 0;--lab-note-margin: .75rem 0 0;--lab-note-color: rgba(var(--lab-text-rgb), .66);--lab-note-font-size: .86rem;display:grid;gap:1rem;margin:2rem 0}:where(.lab-demo) .lab-stage{position:relative;overflow:hidden;border:1px solid rgba(var(--lab-border-rgb),.18);border-radius:1.25rem;background:var(--lab-stage-background);box-shadow:0 24px 80px #00000059}:where(.lab-demo) .lab-canvas{display:block;width:100%}:where(.lab-demo) .lab-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}:where(.lab-demo) .lab-card{border:1px solid rgba(var(--lab-border-rgb),.16);border-radius:1rem;padding:.9rem;background:var(--lab-card-background)}:where(.lab-demo) .lab-eyebrow{margin:0 0 .7rem;color:var(--lab-eyebrow-color);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}:where(.lab-demo) .lab-note{margin:var(--lab-note-margin);color:var(--lab-note-color);font-size:var(--lab-note-font-size);line-height:1.5}:where(.lab-demo) .lab-control-row{display:flex;gap:.55rem;align-items:center;margin:var(--lab-control-row-margin);color:rgba(var(--lab-label-rgb),.84);font-size:var(--lab-control-row-font-size)}:where(.lab-demo) .lab-select-label,:where(.lab-demo) .lab-slider-label{display:grid;gap:.4rem;color:rgba(var(--lab-label-rgb),.84);font-size:.92rem}:where(.lab-demo) .lab-select-label{margin:.55rem 0}:where(.lab-demo) .lab-slider-label{margin:var(--lab-slider-label-margin)}:where(.lab-demo) .lab-select-label select{width:100%;border:1px solid rgba(var(--lab-border-rgb),.18);border-radius:.75rem;padding:.55rem .65rem;background:rgba(var(--lab-input-rgb),.92);color:rgba(var(--lab-bright-rgb),.9)}:where(.lab-demo) .lab-slider{width:100%;height:1.6rem;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer}:where(.lab-demo) .lab-slider:disabled{cursor:not-allowed;opacity:.45}:where(.lab-demo) .lab-slider::-webkit-slider-runnable-track{height:.55rem;border-radius:999px;background:#ffffff24;border:1px solid rgba(255,255,255,.08)}:where(.lab-demo) .lab-slider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:1.15rem;height:1.15rem;margin-top:calc((.55rem - 1.15rem) / 2);border-radius:999px;border:2px solid rgba(255,255,255,.95);background:#141418f5;box-shadow:0 0 0 .35rem rgba(var(--lab-cyan-rgb),.1),0 .45rem 1rem #00000059}:where(.lab-demo) .lab-slider::-moz-range-track{height:.55rem;border-radius:999px;background:#ffffff24;border:1px solid rgba(255,255,255,.08)}:where(.lab-demo) .lab-slider::-moz-range-thumb{width:1.15rem;height:1.15rem;border-radius:999px;border:2px solid rgba(255,255,255,.95);background:#141418f5;box-shadow:0 0 0 .35rem rgba(var(--lab-cyan-rgb),.1),0 .45rem 1rem #00000059}:where(.lab-demo) .lab-slider:focus-visible{outline:none}:where(.lab-demo) .lab-slider:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 .35rem #ffffff29,0 0 0 .55rem #7896ff2e,0 .45rem 1rem #00000059}:where(.lab-demo) .lab-slider:focus-visible::-moz-range-thumb{box-shadow:0 0 0 .35rem #ffffff29,0 0 0 .55rem #7896ff2e,0 .45rem 1rem #00000059}:where(.lab-demo) .lab-checkbox{position:relative;cursor:pointer;user-select:none}:where(.lab-demo) .lab-checkbox input{position:absolute;opacity:0;pointer-events:none}:where(.lab-demo) .lab-checkmark{position:relative;display:inline-grid;place-items:center;width:1.1rem;height:1.1rem;flex:0 0 auto;border:1px solid rgba(var(--lab-border-rgb),.26);border-radius:.38rem;background:linear-gradient(135deg,#ffffff14,#ffffff05),rgba(var(--lab-input-rgb),.88)}:where(.lab-demo) .lab-checkmark:after{content:"";width:.46rem;height:.26rem;border-left:2px solid rgba(var(--lab-surface-rgb),.95);border-bottom:2px solid rgba(var(--lab-surface-rgb),.95);transform:rotate(-45deg) scale(0)}:where(.lab-demo) .lab-checkbox input:checked+.lab-checkmark{border-color:rgba(var(--lab-cyan-rgb),.88);background:linear-gradient(135deg,rgba(var(--lab-cyan-rgb),.95),rgba(var(--lab-lilac-rgb),.92))}:where(.lab-demo) .lab-checkbox input:checked+.lab-checkmark:after{transform:rotate(-45deg) scale(1)}:where(.lab-demo) .lab-checkbox input:focus-visible+.lab-checkmark{outline:2px solid rgba(var(--lab-bright-rgb),.9);outline-offset:3px}:where(.lab-demo) .lab-checkbox--glow .lab-checkmark{box-shadow:inset 0 1px #ffffff14,0 .45rem 1rem #00000038;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease,transform .15s ease}:where(.lab-demo) .lab-checkbox--glow .lab-checkmark:after{transition:transform .15s ease}:where(.lab-demo) .lab-checkbox--glow:hover .lab-checkmark{border-color:rgba(var(--lab-cyan-rgb),.72);box-shadow:inset 0 1px #ffffff1a,0 0 0 .28rem rgba(var(--lab-cyan-rgb),.08),0 .45rem 1rem #00000038}:where(.lab-demo) .lab-checkbox--glow input:checked+.lab-checkmark{border-color:rgba(var(--lab-cyan-rgb),.88);background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.75),transparent 22%),linear-gradient(135deg,rgba(var(--lab-cyan-rgb),.95),rgba(var(--lab-lilac-rgb),.92));box-shadow:0 0 0 .28rem rgba(var(--lab-cyan-rgb),.12),0 .75rem 1.4rem rgba(var(--lab-blue-rgb),.28)}:where(.lab-demo) .lab-checkbox--glow input:checked+.lab-checkmark+span{color:rgba(var(--lab-bright-rgb),.94)}:where(.lab-demo) .lab-primary-button,:where(.lab-demo) .lab-secondary-button{width:100%;border:1px solid rgba(var(--lab-border-rgb),.2);border-radius:.8rem;padding:.65rem .8rem;color:rgba(var(--lab-bright-rgb),.92);font:inherit;font-weight:700;cursor:pointer}:where(.lab-demo) .lab-primary-button{border-color:rgba(var(--lab-cyan-rgb),.28);background:linear-gradient(135deg,rgba(var(--lab-blue-rgb),.42),rgba(var(--lab-violet-rgb),.28));color:rgba(var(--lab-bright-rgb),.95);transition:border-color .15s ease,background .15s ease,opacity .15s ease}:where(.lab-demo) .lab-primary-button:hover:not(:disabled){border-color:rgba(var(--lab-cyan-rgb),.48);background:linear-gradient(135deg,rgba(var(--lab-blue-rgb),.52),rgba(var(--lab-violet-rgb),.36))}:where(.lab-demo) .lab-primary-button:disabled{opacity:var(--lab-primary-disabled-opacity, .4);cursor:not-allowed}:where(.lab-demo) .lab-secondary-button{background:#ffffff0a}:where(.lab-demo) .lab-secondary-button:hover{background:#ffffff14}@media(max-width:900px){:where(.lab-demo) .lab-controls{grid-template-columns:1fr}}