:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#1a1a1a;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#000;text-decoration:inherit}a:hover{color:#333}body{margin:0;display:flex;min-width:320px;min-height:100vh;height:100vh;overflow:hidden}h1{font-size:3.2em;line-height:1.1}button{border-radius:1em;corner-shape:superellipse(var(--corner-n, 1));border:1px solid #ccc;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#fff;color:#000;cursor:pointer;transition:border-color .25s}button:hover{border-color:#000}button:focus,button:focus-visible{outline:2px solid #000}.app{display:flex;flex-direction:column;width:100vw;height:100dvh;overflow:hidden}.preview-area{flex:1;display:flex;justify-content:center;align-items:center;min-height:0;background:#fff}.superellipse-svg{width:100%;height:100%;max-width:min(70vw,70vh);max-height:min(70vw,70vh)}.bottom-toolbar{display:flex;align-items:center;gap:1.5rem;padding:.75rem 1.5rem;border-top:1px solid #e0e0e0;background:#fafafa;flex-shrink:0}.toolbar-title{font-size:.7rem;font-weight:700;color:#999;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;-webkit-user-select:none;user-select:none}.toolbar-controls{display:flex;align-items:center;gap:1.25rem;flex:1;min-width:0}.slider-control{display:flex;align-items:center;gap:.35rem;min-width:0}.slider-label{font-weight:600;font-size:.7rem;color:#888;text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;-webkit-user-select:none;user-select:none}.number-dragger{position:relative;display:flex;align-items:center;justify-content:center;width:7em;height:1.6em;background:#f0f0f0;border:1px solid #ddd;border-radius:.75em;corner-shape:superellipse(var(--corner-n, 1));overflow:hidden;-webkit-user-select:none;user-select:none;outline:none;font-family:inherit;touch-action:none}.number-dragger:focus-visible{border-color:#000;box-shadow:0 0 0 1px #000}.number-dragger--dragging{cursor:ew-resize}.number-dragger-bar{position:absolute;top:0;left:0;height:100%;background:#0000001a;pointer-events:none;transition:width .04s ease-out}.number-dragger--dragging .number-dragger-bar{transition:none}.number-dragger-handle{position:absolute;top:0;width:1px;height:100%;background:#00000059;pointer-events:none;transition:left .04s ease-out}.number-dragger--dragging .number-dragger-handle{transition:none}.number-dragger-value{position:relative;z-index:1;font-variant-numeric:tabular-nums;font-size:.75rem;color:#000;pointer-events:none;white-space:nowrap}.number-dragger-input{position:relative;z-index:1;width:100%;height:100%;border:none;background:#fff;font-variant-numeric:tabular-nums;font-size:.75rem;font-family:inherit;color:#000;text-align:center;outline:none;padding:0 .3em}.number-dragger--editing{border-color:#000;box-shadow:0 0 0 1px #000}.number-dragger-overlay{position:absolute;top:50%;left:50%;overflow:visible;pointer-events:none;z-index:1}.range-input{width:3.5em;font-size:.65rem;font-variant-numeric:tabular-nums;color:#999;background:transparent;border:1px solid #e0e0e0;border-radius:.6em;corner-shape:superellipse(var(--corner-n, 1));padding:.15em .25em;text-align:center;font-family:inherit;-moz-appearance:textfield}.range-input::-webkit-inner-spin-button,.range-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.range-input:focus{outline:1px solid #000;border-color:#000}.toolbar-actions{display:flex;align-items:center;gap:.5rem;margin-left:auto;flex-shrink:0}.copy-button{padding:.4em .8em;font-size:.8rem;white-space:nowrap}.copy-button.copied{border-color:#000;color:#000;background:#e8e8e8}.steps-row{display:flex;gap:.35rem;align-items:stretch}.steps-input{width:3em;text-align:center;font-size:.75rem;font-family:inherit;font-variant-numeric:tabular-nums;background:transparent;border:1px solid #ddd;border-radius:.75em;corner-shape:superellipse(var(--corner-n, 1));color:inherit;-moz-appearance:textfield}.steps-input::-webkit-inner-spin-button,.steps-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.steps-input:focus{outline:1px solid #000;border-color:#000}@media(max-width:768px){.bottom-toolbar{flex-wrap:wrap;padding:.5rem 1rem;gap:.5rem}.toolbar-controls{flex-wrap:wrap;gap:.75rem;flex-basis:100%}.toolbar-actions{flex-basis:100%;justify-content:flex-end}}