.crosshair-main.svelte-17wuy9{width:min(100%, var(--site-content-width));min-height:100vh;padding:7rem var(--site-gutter) 5rem;flex-direction:column;gap:2rem;margin:0 auto;display:flex}.tool-heading.svelte-17wuy9,.preview-panel.svelte-17wuy9 footer:where(.svelte-17wuy9),.preview-panel.svelte-17wuy9 footer:where(.svelte-17wuy9) div:where(.svelte-17wuy9),.color-setting.svelte-17wuy9,.range-setting.svelte-17wuy9 span:where(.svelte-17wuy9),.toggles.svelte-17wuy9>label:where(.svelte-17wuy9){align-items:center;display:flex}.tool-heading.svelte-17wuy9{justify-content:space-between;gap:1rem}h1.svelte-17wuy9,h2.svelte-17wuy9,.tool-heading.svelte-17wuy9 p:where(.svelte-17wuy9){margin:0}h1.svelte-17wuy9{font-size:2.25rem}h2.svelte-17wuy9{font-size:.875rem}.tool-heading.svelte-17wuy9 p:where(.svelte-17wuy9){color:var(--muted-foreground);margin-top:.35rem}.workspace.svelte-17wuy9{border-top:1px solid var(--border);border-bottom:1px solid var(--border);grid-template-columns:19rem minmax(0,1fr);display:grid}.controls.svelte-17wuy9{border-right:1px solid var(--border);flex-direction:column;display:flex}.control-group.svelte-17wuy9{border-bottom:1px solid var(--border);flex-direction:column;gap:.8rem;padding:1.25rem 1.25rem 1.4rem 0;display:flex}.control-group.svelte-17wuy9:last-child{border-bottom:0}.number-pair.svelte-17wuy9{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;display:grid}.number-pair.svelte-17wuy9 label:where(.svelte-17wuy9){color:var(--muted-foreground);gap:.35rem;font-size:.75rem;display:grid}.color-setting.svelte-17wuy9{justify-content:space-between;gap:.75rem;font-size:.8rem}.color-setting.svelte-17wuy9 input:where(.svelte-17wuy9){cursor:pointer;background:0 0;border:0;width:2rem;height:2rem;padding:0}.color-setting.svelte-17wuy9 code:where(.svelte-17wuy9){color:var(--muted-foreground);font-size:.75rem}.range-setting.svelte-17wuy9{gap:.35rem;display:grid}.range-setting.svelte-17wuy9 span:where(.svelte-17wuy9){color:var(--muted-foreground);justify-content:space-between;font-size:.8rem}.range-setting.svelte-17wuy9 output:where(.svelte-17wuy9){color:var(--foreground);font-variant-numeric:tabular-nums}.range-setting.svelte-17wuy9 input:where(.svelte-17wuy9){width:100%;accent-color:var(--primary);cursor:pointer}.toggles.svelte-17wuy9>label:where(.svelte-17wuy9){justify-content:space-between;gap:1rem;font-size:.875rem}.toggles.svelte-17wuy9 .outline-size:where(.svelte-17wuy9){align-items:initial;display:grid}.preview-panel.svelte-17wuy9{flex-direction:column;min-width:0;padding-left:1.5rem;display:flex}.preview-stage.svelte-17wuy9{background-color:#8a8a8a;background-image:linear-gradient(45deg,#777 25%,#0000 25%),linear-gradient(-45deg,#777 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#777 75%),linear-gradient(-45deg,#0000 75%,#777 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;flex:1;place-items:center;min-height:30rem;padding:2rem;display:grid}canvas.svelte-17wuy9{object-fit:contain;width:100%;height:auto;max-height:34rem;display:block}.preview-panel.svelte-17wuy9 footer:where(.svelte-17wuy9){justify-content:space-between;gap:1rem;min-height:4.5rem}.preview-panel.svelte-17wuy9 footer:where(.svelte-17wuy9)>span:where(.svelte-17wuy9){color:var(--muted-foreground);font-variant-numeric:tabular-nums;font-size:.8rem}.preview-panel.svelte-17wuy9 footer:where(.svelte-17wuy9) div:where(.svelte-17wuy9){gap:.5rem}@media (width<=799px){.workspace.svelte-17wuy9{grid-template-columns:1fr}.controls.svelte-17wuy9{border-right:0}.control-group.svelte-17wuy9{padding-right:0}.preview-panel.svelte-17wuy9{border-top:1px solid var(--border);padding-left:0}}@media (width<=639px){.crosshair-main.svelte-17wuy9{padding:6rem var(--site-gutter) 4rem}.tool-heading.svelte-17wuy9{flex-direction:column;align-items:flex-start}h1.svelte-17wuy9{font-size:1.85rem}.preview-stage.svelte-17wuy9{min-height:20rem;padding:1rem}.preview-panel.svelte-17wuy9 footer:where(.svelte-17wuy9){flex-direction:column;align-items:flex-start;padding:.9rem 0}.preview-panel.svelte-17wuy9 footer:where(.svelte-17wuy9) div:where(.svelte-17wuy9){width:100%}.preview-panel.svelte-17wuy9 footer:where(.svelte-17wuy9) div:where(.svelte-17wuy9) button{flex:1}}
