.nl-gradient-tools-color-stops{border:1px solid var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black));z-index:1;border-radius:4px;height:32px;position:relative}.nl-gradient-tools-color-stops:before{content:"";background-image:linear-gradient(45deg, var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black)) 26%, transparent 26%), linear-gradient(135deg, var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black)) 26%, transparent 26%), linear-gradient(45deg, transparent 75%, var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black)) 75%), linear-gradient(135deg, transparent 75%, var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black)) 75%);border-radius:inherit;z-index:1;background-position:0 0,10px 0,10px -10px,0 10px;background-size:20px 20px;display:block;position:absolute;inset:0}.nl-gradient-tools-color-stops:after{content:"";background:var(--background);border-radius:inherit;z-index:2;display:block;position:absolute;inset:0}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop{background-color:var(--lightningcss-light,var(--dark-gray))var(--lightningcss-dark,var(--light-gray));z-index:1;width:0;height:32px;position:absolute;top:0;left:0}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop:before{content:attr(data-nl-gradient-tools-color-stop) "%";color:var(--lightningcss-light,var(--dark-gray))var(--lightningcss-dark,var(--light-gray));display:block;position:absolute;bottom:calc(100% + 16px);left:50%;transform:translate(-50%)}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-toggle{background-image:linear-gradient(45deg, var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black)) 26%, transparent 26%), linear-gradient(135deg, var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black)) 26%, transparent 26%), linear-gradient(45deg, transparent 75%, var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black)) 75%), linear-gradient(135deg, transparent 75%, var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black)) 75%);background-position:0 0,10px 0,10px -10px,0 10px;background-size:20px 20px;border-radius:4px;width:24px;height:24px;position:absolute;top:calc(100% + 12px);left:50%;transform:translate(-50%)}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-toggle:before{content:"";background-color:var(--color,transparent);border:1px solid var(--lightningcss-light,var(--dark-gray))var(--lightningcss-dark,var(--light-gray));border-radius:inherit;display:block;position:absolute;inset:0}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-settings{top:calc(var(--top) + 88px);left:var(--left);right:unset;bottom:unset;background-color:var(--lightningcss-light,var(--shaded-white))var(--lightningcss-dark,var(--tinted-black));z-index:3;border:0;border-radius:24px;width:280px;min-width:0;height:auto;min-height:0;margin:0;padding:16px;position:absolute;overflow:visible}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-settings::backdrop{display:none}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-settings:before{content:"";top:-10px;left:var(--fake-center);background-color:inherit;transform-origin:50%;z-index:-1;border-top-left-radius:8px;width:20px;height:20px;display:block;position:absolute;transform:translate(-50%)rotate(45deg)}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-settings:popover-open{gap:12px;display:grid}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-settings .nl-gradient-tools-color-stop-settings-fieldset{border:0;margin:0;padding:0}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-settings .nl-gradient-tools-color-stop-settings-fieldset:not(:last-child){margin-bottom:12px}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop .nl-gradient-tools-color-stop-settings .nl-gradient-tools-color-stop-settings-actions{grid-auto-columns:1fr;grid-auto-flow:column;gap:8px;display:grid}.nl-gradient-tools-color-stops .nl-gradient-tools-color-stop-add{top:50%;left:var(--mouse-x,0%);background-color:var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black));color:oklch(76.6528% .138677 91.0594);pointer-events:none;z-index:3;border:0;border-radius:4px;width:28px;height:28px;font-size:28px;font-weight:600;line-height:28px;transition:opacity .25s ease-in-out;position:absolute;transform:translate(-50%,-50%)}.nl-gradient-tools-color-stops:not(:hover) .nl-gradient-tools-color-stop-add{opacity:0}.nl-gradient-tools-color-stops:has(.nl-gradient-tools-color-stop:hover) .nl-gradient-tools-color-stop-add{opacity:0}.nl-gradient-tools-form{grid-template-columns:1fr 340px min-content;gap:48px;display:grid}.nl-gradient-tools-form:not(:last-child){margin-bottom:64px}.nl-gradient-tools{gap:64px}.nl-gradient-tools-preview{grid-auto-columns:1fr;grid-auto-flow:column;gap:64px;width:100%;display:grid}.nl-gradient-tools-preview .nl-gradient-tools-preview-css,.nl-gradient-tools-preview .nl-gradient-tools-preview-svg{width:100%;aspect-ratio:var(--aspect-ratio,1);border:1px solid var(--lightningcss-light,var(--dark-white))var(--lightningcss-dark,var(--light-black));border-radius:4px}.nl-gradient-tools-output{grid-auto-columns:1fr;grid-auto-flow:column;gap:64px;display:grid}
