.ScrollAnimationBuilderClient-module__dQr_9a__wrapper{gap:1.75rem}.ScrollAnimationBuilderClient-module__dQr_9a__header{background:var(--surface);border:1px solid var(--border);border-radius:calc(var(--radius) + 4px);box-shadow:var(--shadow-1);flex-direction:column;gap:1rem;padding:1.6rem 1.75rem;display:flex}.ScrollAnimationBuilderClient-module__dQr_9a__layout{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:start;gap:1.5rem;display:grid}.ScrollAnimationBuilderClient-module__dQr_9a__panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1);flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex}.ScrollAnimationBuilderClient-module__dQr_9a__previewPanel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-2);flex-direction:column;gap:1.5rem;padding:1.6rem;display:flex}.ScrollAnimationBuilderClient-module__dQr_9a__sectionHeader{flex-direction:column;gap:.4rem;display:flex}.ScrollAnimationBuilderClient-module__dQr_9a__grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;display:grid}.ScrollAnimationBuilderClient-module__dQr_9a__field{flex-direction:column;gap:.45rem;font-size:.95rem;display:flex}.ScrollAnimationBuilderClient-module__dQr_9a__field input,.ScrollAnimationBuilderClient-module__dQr_9a__field select{border-radius:var(--radius-sm);border:1px solid var(--border);background:color-mix(in oklab,var(--surface)96%,transparent);color:inherit;padding:.55rem .65rem}.ScrollAnimationBuilderClient-module__dQr_9a__field input:focus,.ScrollAnimationBuilderClient-module__dQr_9a__field select:focus{outline:2px solid color-mix(in srgb,var(--brand)28%,transparent);outline-offset:2px}.ScrollAnimationBuilderClient-module__dQr_9a__checkbox{flex-direction:row;align-items:center;gap:.6rem}.ScrollAnimationBuilderClient-module__dQr_9a__checkbox input{width:1.1rem;height:1.1rem}.ScrollAnimationBuilderClient-module__dQr_9a__previewBox{gap:1rem;display:grid}.ScrollAnimationBuilderClient-module__dQr_9a__previewTrack{border-radius:calc(var(--radius));border:1px dashed var(--border);background:color-mix(in oklab,var(--surface-2)85%,transparent);justify-content:center;align-items:center;min-height:200px;display:flex;position:relative;overflow:hidden}.ScrollAnimationBuilderClient-module__dQr_9a__previewGhost{background:radial-gradient(circle at 50% 50%,color-mix(in oklab,var(--brand)15%,transparent)0%,transparent 65%);opacity:.28;pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.ScrollAnimationBuilderClient-module__dQr_9a__previewDot{border-radius:calc(var(--radius) + 12px);background:linear-gradient(135deg,var(--brand),color-mix(in oklab,var(--brand)65%,white 35%));color:#fff;letter-spacing:.3px;place-items:center;min-width:120px;min-height:120px;font-weight:600;transition:transform .2s,opacity .2s;display:grid;position:relative;box-shadow:0 18px 42px rgba(220,56,45,.28)}.ScrollAnimationBuilderClient-module__dQr_9a__previewDot span{pointer-events:none}.ScrollAnimationBuilderClient-module__dQr_9a__slider input[type=range]{accent-color:var(--brand)}.ScrollAnimationBuilderClient-module__dQr_9a__stateGrid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;display:grid}.ScrollAnimationBuilderClient-module__dQr_9a__stateFields{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.85rem;display:grid}.ScrollAnimationBuilderClient-module__dQr_9a__outputGrid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;display:grid}.ScrollAnimationBuilderClient-module__dQr_9a__codeBlock{background:color-mix(in oklab,var(--surface)92%,transparent);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1);flex-direction:column;gap:1rem;padding:1.25rem 1.35rem;display:flex}.ScrollAnimationBuilderClient-module__dQr_9a__codeBlock header{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.ScrollAnimationBuilderClient-module__dQr_9a__codeBlock pre{background:color-mix(in oklab,var(--surface-2)85%,transparent);border-radius:calc(var(--radius) - 6px);margin:0;padding:1rem;font-family:Fira Code,SFMono-Regular,ui-monospace,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.9rem;line-height:1.6;overflow-x:auto}@media (max-width:1024px){.ScrollAnimationBuilderClient-module__dQr_9a__layout{grid-template-columns:1fr}}@media (max-width:720px){.ScrollAnimationBuilderClient-module__dQr_9a__outputGrid{grid-template-columns:1fr}.ScrollAnimationBuilderClient-module__dQr_9a__previewDot{min-width:96px;min-height:96px}}