.sdg-page:where(.astro-k5zccnzo) .sdg-hero:where(.astro-k5zccnzo){margin-bottom:2rem}.sdg:where(.astro-k5zccnzo) :where(.astro-k5zccnzo)[hidden]{display:none!important}.sdg:where(.astro-k5zccnzo){grid-template-columns:minmax(250px,320px) minmax(0,1fr);align-items:start;gap:1.25rem;margin:0 0 3.5rem;display:grid}.sdg-controls:where(.astro-k5zccnzo),.sdg-preview:where(.astro-k5zccnzo),.sdg-export:where(.astro-k5zccnzo){border:1px solid var(--line);background:var(--panel-strong);border-radius:1.1rem}.sdg-controls:where(.astro-k5zccnzo){gap:.85rem;padding:1.2rem;display:grid}.sdg-field:where(.astro-k5zccnzo){color:var(--muted);gap:.35rem;font-size:.86rem;display:grid}.sdg-field:where(.astro-k5zccnzo)>span:where(.astro-k5zccnzo){color:var(--text);justify-content:space-between;gap:.5rem;font-weight:650;display:flex}.sdg-field:where(.astro-k5zccnzo) output:where(.astro-k5zccnzo){color:var(--muted);font-variant-numeric:tabular-nums;font-weight:500}.sdg:where(.astro-k5zccnzo) select:where(.astro-k5zccnzo),.sdg:where(.astro-k5zccnzo) input:where(.astro-k5zccnzo)[type=number],.sdg:where(.astro-k5zccnzo) input:where(.astro-k5zccnzo)[type=text]{border:1px solid var(--line);width:100%;min-height:2.5rem;color:var(--text);font:inherit;background:#ffffff0a;border-radius:.6rem;padding:.45rem .65rem;font-size:.92rem}.sdg:where(.astro-k5zccnzo) select:where(.astro-k5zccnzo):focus-visible,.sdg:where(.astro-k5zccnzo) input:where(.astro-k5zccnzo):focus-visible,.sdg:where(.astro-k5zccnzo) textarea:where(.astro-k5zccnzo):focus-visible{outline:2px solid var(--product-accent);outline-offset:1px}.sdg:where(.astro-k5zccnzo) input:where(.astro-k5zccnzo)[type=range]{width:100%;accent-color:var(--product-accent)}.sdg-hint:where(.astro-k5zccnzo){color:var(--muted);margin:-.35rem 0 0;font-size:.8rem;line-height:1.45}.sdg-pair:where(.astro-k5zccnzo){grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.sdg-seed:where(.astro-k5zccnzo){grid-template-columns:1fr auto;align-items:end;gap:.75rem;display:grid}.sdg-seed:where(.astro-k5zccnzo) .guide-button:where(.astro-k5zccnzo){min-height:2.5rem;padding:.45rem .9rem}.sdg-error:where(.astro-k5zccnzo){color:#ff8a9a;margin:0;font-size:.86rem}.sdg-error:where(.astro-k5zccnzo):empty{display:none}.sdg-output:where(.astro-k5zccnzo){gap:1.25rem;min-width:0;display:grid}.sdg-preview:where(.astro-k5zccnzo){margin:0;padding:1rem 1.1rem .9rem}.sdg-preview:where(.astro-k5zccnzo) figcaption:where(.astro-k5zccnzo){color:var(--muted);font-variant-numeric:tabular-nums;margin-bottom:.4rem;font-size:.86rem}.sdg-preview:where(.astro-k5zccnzo) svg:where(.astro-k5zccnzo){width:100%;height:auto;display:block}.sdg-preview:where(.astro-k5zccnzo) .sdg-axis{stroke:#ffffff38;stroke-width:1px}.sdg-preview:where(.astro-k5zccnzo) .sdg-zero{stroke:#ffffff59;stroke-width:1px;stroke-dasharray:4 4}.sdg-preview:where(.astro-k5zccnzo) .sdg-tick{fill:var(--muted);font-family:inherit;font-size:13px}.sdg-legend:where(.astro-k5zccnzo){color:var(--muted);flex-wrap:wrap;gap:.4rem 1rem;margin:.5rem 0 0;padding:0;font-size:.82rem;list-style:none;display:flex}.sdg-legend:where(.astro-k5zccnzo) span{vertical-align:middle;border-radius:1rem;width:.8rem;height:.2rem;margin-right:.4rem;display:inline-block}.sdg-export:where(.astro-k5zccnzo){gap:.8rem;min-width:0;padding:1rem 1.1rem 1.1rem;display:grid}.sdg-export-bar:where(.astro-k5zccnzo){flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.sdg-tabs:where(.astro-k5zccnzo){flex-wrap:wrap;gap:.4rem;display:flex}.sdg-tabs:where(.astro-k5zccnzo) label:where(.astro-k5zccnzo){border:1px solid var(--line);cursor:pointer;border-radius:.6rem;padding:.4rem .8rem;font-size:.86rem;font-weight:650;position:relative}.sdg-tabs:where(.astro-k5zccnzo) input:where(.astro-k5zccnzo){opacity:0;pointer-events:none;position:absolute}.sdg-tabs:where(.astro-k5zccnzo) label:where(.astro-k5zccnzo):has(input:checked){border-color:var(--product-accent);color:var(--product-accent);background:color-mix(in srgb, var(--product-accent), transparent 88%)}.sdg-tabs:where(.astro-k5zccnzo) label:where(.astro-k5zccnzo):has(input:focus-visible){outline:2px solid var(--product-accent);outline-offset:2px}.sdg-variable:where(.astro-k5zccnzo){color:var(--muted);align-items:center;gap:.5rem;font-size:.86rem;display:flex}.sdg-variable:where(.astro-k5zccnzo) input:where(.astro-k5zccnzo){width:10rem}.sdg:where(.astro-k5zccnzo) textarea:where(.astro-k5zccnzo){border:1px solid var(--line);width:100%;min-height:14rem;max-height:26rem;color:var(--text);resize:vertical;white-space:pre;background:#00000047;border-radius:.7rem;padding:.8rem .9rem;font:.82rem/1.55 ui-monospace,SFMono-Regular,Consolas,Menlo,monospace}.sdg-actions:where(.astro-k5zccnzo){flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.sdg-status:where(.astro-k5zccnzo){color:var(--muted);margin:0;font-size:.86rem}.sdg-patterns:where(.astro-k5zccnzo){gap:.55rem;margin:1rem 0 1.2rem;display:grid}.sdg-patterns:where(.astro-k5zccnzo) div:where(.astro-k5zccnzo){border-bottom:1px solid var(--line);grid-template-columns:9.5rem 1fr;gap:1rem;padding-bottom:.55rem;display:grid}.sdg-patterns:where(.astro-k5zccnzo) dt:where(.astro-k5zccnzo){color:var(--text);font-weight:700}.sdg-patterns:where(.astro-k5zccnzo) dd:where(.astro-k5zccnzo){color:var(--muted);margin:0}.sdg-code:where(.astro-k5zccnzo){border:1px solid var(--line);background:#0000004d;border-radius:.8rem;padding:1rem 1.1rem;font-size:.85rem;line-height:1.55;overflow-x:auto}.sdg-faq:where(.astro-k5zccnzo) h3:where(.astro-k5zccnzo){margin-bottom:.35rem}.sdg-cta:where(.astro-k5zccnzo){border:1px solid var(--line);background:linear-gradient(135deg, color-mix(in srgb, var(--product-accent), transparent 86%), transparent 70%), var(--panel-strong);border-radius:1.2rem;margin:3.5rem 0 4rem;padding:2rem}.sdg-cta:where(.astro-k5zccnzo) h2:where(.astro-k5zccnzo){margin:0 0 .6rem}.sdg-cta:where(.astro-k5zccnzo) p:where(.astro-k5zccnzo){color:var(--muted);max-width:720px;margin:0 0 1.2rem;line-height:1.6}.sdg-cta-actions:where(.astro-k5zccnzo){flex-wrap:wrap;gap:.75rem;display:flex}@media (width<=860px){.sdg:where(.astro-k5zccnzo){grid-template-columns:minmax(0,1fr)}.sdg-patterns:where(.astro-k5zccnzo) div:where(.astro-k5zccnzo){grid-template-columns:minmax(0,1fr);gap:.2rem}.sdg-cta:where(.astro-k5zccnzo){padding:1.4rem}}