@layer starlight.components{.sl-steps{--bullet-size:calc(var(--sl-line-height) * 1rem);--bullet-margin:.375rem;counter-reset:steps-counter var(--sl-steps-start,0);padding-inline-start:0;list-style:none}.sl-steps>li{counter-increment:steps-counter;padding-inline-start:calc(var(--bullet-size) + 1rem);min-height:calc(var(--bullet-size) + var(--bullet-margin));padding-bottom:1px;position:relative}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);top:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);box-shadow:inset 0 0 0 1px var(--sl-color-gray-5);border-radius:99rem;font-weight:600;position:absolute;inset-inline-start:0}.sl-steps>li:after{--guide-width:1px;content:"";top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);width:var(--guide-width);background-color:var(--sl-color-hairline-light);position:absolute;inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2)}}@layer starlight.content{.sl-steps>li>:first-child{--lh:calc(1em * var(--sl-line-height));--shift-y:calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh:calc(1em * var(--sl-line-height-headings))}@supports (--prop:1lh){.sl-steps>li>:first-child{--lh:1lh}}}.property-playground:where(.astro-x65ylac5){border:1px solid var(--sl-color-hairline-light);background:var(--sl-color-bg-nav);border-radius:1rem;margin-block:2.5rem;padding:clamp(1.25rem,3vw,2rem);container:property-playground/inline-size}.playground-copy:where(.astro-x65ylac5){max-width:42rem}.playground-copy:where(.astro-x65ylac5) h2:where(.astro-x65ylac5){color:var(--sl-color-white);letter-spacing:-.025em;margin:0;font-size:clamp(1.45rem,3vw,2rem);line-height:1.15}.playground-copy:where(.astro-x65ylac5) p:where(.astro-x65ylac5){color:var(--sl-color-gray-2);margin:.65rem 0 0;line-height:1.65}.playground-layout:where(.astro-x65ylac5){gap:1.25rem;margin-top:1.5rem;display:grid}.property-controls:where(.astro-x65ylac5){flex-direction:column;gap:1rem;min-width:0;display:flex}fieldset:where(.astro-x65ylac5){border:0;min-width:0;margin:0;padding:0}legend:where(.astro-x65ylac5){color:var(--sl-color-gray-3);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.65rem;font-size:.78rem;font-weight:700}.control-row:where(.astro-x65ylac5){border-bottom:1px solid var(--sl-color-hairline-light);justify-content:space-between;align-items:center;gap:1rem;min-height:4.5rem;padding:.8rem 0;display:flex}.control-row:where(.astro-x65ylac5):first-of-type{border-top:1px solid var(--sl-color-hairline-light)}.control-row:where(.astro-x65ylac5)>span:where(.astro-x65ylac5):first-child{gap:.15rem;display:grid}.control-row:where(.astro-x65ylac5) strong:where(.astro-x65ylac5){color:var(--sl-color-white);font-size:.95rem;line-height:1.3}.control-row:where(.astro-x65ylac5) small:where(.astro-x65ylac5){color:var(--sl-color-gray-3);font-size:.78rem}.color-input-wrap:where(.astro-x65ylac5),.range-input-wrap:where(.astro-x65ylac5){align-items:center;gap:.75rem;min-width:0;display:flex}output:where(.astro-x65ylac5){min-width:4.4rem;color:var(--sl-color-gray-2);font-family:var(--__sl-font-mono);font-variant-numeric:tabular-nums;text-align:end;font-size:.78rem}input:where(.astro-x65ylac5)[type=color]{border:1px solid var(--sl-color-gray-4);background:var(--sl-color-bg);cursor:pointer;border-radius:.75rem;width:2.75rem;height:2.75rem;padding:.2rem}input:where(.astro-x65ylac5)[type=range]{width:min(10rem,28vw);accent-color:var(--sl-color-accent);cursor:pointer}input:where(.astro-x65ylac5)[type=checkbox]{cursor:pointer;width:1.25rem;height:1.25rem}button:where(.astro-x65ylac5){border:1px solid var(--sl-color-gray-4);min-height:2.75rem;color:var(--sl-color-white);font:650 .88rem/1 var(--__sl-font);cursor:pointer;background:0 0;border-radius:.7rem;align-self:flex-start;padding:.6rem .9rem}button:where(.astro-x65ylac5):hover{border-color:var(--sl-color-accent);background:var(--sl-color-accent-low)}button:where(.astro-x65ylac5):focus-visible,input:where(.astro-x65ylac5):focus-visible{outline:3px solid var(--sl-color-accent);outline-offset:3px}.wallpaper-preview:where(.astro-x65ylac5){background:var(--preview-accent);min-height:18rem;color:var(--preview-ink,#08111f);text-align:center;border-radius:.9rem;place-content:center;display:grid;overflow:hidden}.wallpaper-preview:where(.astro-x65ylac5) h3:where(.astro-x65ylac5){letter-spacing:-.035em;opacity:var(--preview-intensity);margin:0;font-size:clamp(1.7rem,5vw,2.8rem);font-weight:800}.wallpaper-preview:where(.astro-x65ylac5) h3:where(.astro-x65ylac5)[hidden]{display:none}@container property-playground (width>=44rem){.playground-layout:where(.astro-x65ylac5){grid-template-columns:minmax(16rem,.86fr) minmax(19rem,1.14fr);align-items:stretch;gap:1.75rem}}@container property-playground (width<=26rem){.control-row:where(.astro-x65ylac5){flex-direction:column;align-items:flex-start;gap:.65rem}.color-input-wrap:where(.astro-x65ylac5),.range-input-wrap:where(.astro-x65ylac5){justify-content:space-between;width:100%}input:where(.astro-x65ylac5)[type=range]{width:100%}.checkbox-control:where(.astro-x65ylac5){flex-direction:row;align-items:center}.wallpaper-preview:where(.astro-x65ylac5){min-height:13rem}}@media (prefers-reduced-motion:reduce){:where(.astro-x65ylac5),:where(.astro-x65ylac5):before,:where(.astro-x65ylac5):after{scroll-behavior:auto!important}}