*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{list-style:none}body{line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-bg:#fff;--color-well:#f3f2ef;--color-field:#f5f5f4;--color-field-hi:#ececea;--color-line:#e4e3e0;--color-line-strong:#c9c8c4;--color-text:#1a1a1a;--color-text-2:#6b6a67;--color-text-3:#9d9c98;--color-btn:#1a1a1a;--color-btn-text:#fff;--color-accent:#1a1a1a;--color-focus:#6b6a67;--color-ring:#1a1a1a14;--color-error:#b03a2e;--color-skeleton:#e6e5e1;--font-sans:-apple-system, BlinkMacSystemFont, "Inter", "Helvetica Neue", "Segoe UI", system-ui, sans-serif;--font-mono:ui-monospace, "SF Mono", Menlo, monospace;--font-size-base:13px;--font-size-sm:11px;--spacing-unit:8px;--spacing-2x:16px;--spacing-3x:24px;--radius:6px;--radius-lg:10px;--ease:cubic-bezier(.2, .7, .2, 1);--z-overlay:1000}html,body,#root{height:100%}body{background:var(--color-bg);color:var(--color-text);font:var(--font-size-base)/1.4 var(--font-sans);-webkit-font-smoothing:antialiased;margin:0}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}:is(button,[tabindex],select,input):focus-visible{outline:1.5px solid var(--color-focus);outline-offset:2px}:is(.select__native,.input):focus-visible{border-color:var(--color-line-strong);box-shadow:0 0 0 3px var(--color-ring);outline:none}.app{flex-direction:column;height:100%;display:flex;overflow:hidden}.canvas{width:100%;height:100%;transition:opacity .3s var(--ease);display:block}.canvas__container{background:var(--color-field);max-width:100%;position:relative;box-shadow:0 1px 2px #00000014}.canvas__skeleton{background:var(--color-skeleton);animation:2s ease-in-out infinite skeleton-pulse;position:absolute;inset:0}.canvas__error{color:var(--color-error);font-size:var(--font-size-sm);place-items:center;font-weight:500;display:grid;position:absolute;inset:0}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.4}}.select{align-items:center;gap:var(--spacing-unit);display:flex;position:relative}.select__native{appearance:none;min-width:0;font:inherit;color:var(--color-text);background:var(--color-field);border:1px solid var(--color-line);border-radius:var(--radius);cursor:pointer;text-overflow:ellipsis;flex:1;padding:8px 28px 8px 12px}.select__native:hover{background:var(--color-field-hi)}.select__chevron{border-right:1.5px solid var(--color-text-2);border-bottom:1.5px solid var(--color-text-2);pointer-events:none;width:6px;height:6px;position:absolute;top:50%;right:12px;transform:translateY(-70%)rotate(45deg)}.input{min-width:0;font:inherit;font-family:var(--font-mono);color:var(--color-text);background:var(--color-field);border:1px solid var(--color-line);border-radius:var(--radius);flex:1;padding:8px 12px}.input:hover{background:var(--color-field-hi)}.input--invalid{border-color:var(--color-error)}.input--code{width:16ch;font-size:var(--font-size-sm);text-align:right;flex:none;padding:2px 8px}.segmented{background:var(--color-field);border:1px solid var(--color-line);border-radius:var(--radius);flex:none;gap:2px;padding:2px;display:inline-flex}.segmented__option{font-size:var(--font-size-sm);color:var(--color-text-2);border-radius:calc(var(--radius) - 2px);transition:background .12s var(--ease), color .12s var(--ease);padding:2px 10px}.segmented__option:hover{color:var(--color-text)}.segmented__option--current{background:var(--color-bg);color:var(--color-text);box-shadow:0 0 0 1px var(--color-line);font-weight:500}.slider__input{appearance:none;cursor:pointer;background:0 0;width:100%;height:16px;margin:0}.slider__input::-webkit-slider-runnable-track{background:var(--color-line-strong);border-radius:1px;height:2px}.slider__input::-webkit-slider-thumb{appearance:none;background:var(--color-accent);border-radius:50%;width:12px;height:12px;margin-top:-5px}.slider__input::-moz-range-track{background:var(--color-line-strong);border-radius:1px;height:2px}.slider__input::-moz-range-thumb{background:var(--color-accent);border:0;border-radius:50%;width:12px;height:12px}.btn{text-align:center;background:var(--color-field);border:1px solid var(--color-line);border-radius:var(--radius);width:100%;transition:background .12s var(--ease);padding:8px 12px;font-weight:500;display:block}.btn:hover:not(:disabled){background:var(--color-field-hi)}.btn:disabled{opacity:.5;cursor:default}.btn--primary{background:var(--color-btn);color:var(--color-btn-text);border-color:var(--color-btn)}.btn--primary:hover:not(:disabled){background:#333}.btn--icon{justify-content:center;align-items:center;gap:6px;display:inline-flex}.btn--square{aspect-ratio:1;width:auto;padding:0}.btn--text{background:0 0;border-color:#0000;padding:4px 0}.btn--text:hover:not(:disabled){background:0 0;text-decoration:underline}.dropzone-overlay{z-index:var(--z-overlay);padding:var(--spacing-3x);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none;background:#ffffffb8;place-items:center;display:grid;position:fixed;inset:0}.dropzone-overlay:before{content:"";inset:var(--spacing-3x);border:1px dashed var(--color-text);border-radius:var(--radius-lg);position:absolute}.dropzone-overlay__content{font-size:15px;font-weight:600}.field{gap:var(--spacing-unit);flex-direction:column;display:flex}.field__head{justify-content:space-between;align-items:center;gap:var(--spacing-unit);min-height:32px;display:flex}.field__label{font-weight:600}.field__aside{color:var(--color-text-2);font-size:var(--font-size-sm);font-variant-numeric:tabular-nums}.field__hint{color:var(--color-text-2);font-size:var(--font-size-sm);overflow-wrap:anywhere}.field__status{color:var(--color-text-2);font-size:var(--font-size-sm);min-height:1.2em}.row{gap:var(--spacing-unit);grid-template-columns:1fr 1fr;display:grid}.row--trailing{grid-template-columns:1fr auto}.links{gap:var(--spacing-2x);display:flex}.links .btn{width:auto}.error-screen{justify-content:center;align-items:center;gap:var(--spacing-2x);min-height:100%;padding:var(--spacing-3x);text-align:center;flex-direction:column;display:flex}.error-screen__title{margin:0;font-size:20px}.error-screen__text{color:var(--color-text-2);margin:0}.error-screen .btn{width:auto}.error-screen__detail{max-width:100%;padding:var(--spacing-2x);background:var(--color-field);border-radius:var(--radius);color:var(--color-error);font-size:var(--font-size-sm);text-align:left;overflow:auto}.studio{gap:var(--spacing-3x);min-height:0;padding:var(--spacing-3x);flex:1;grid-template-columns:minmax(0,1fr) 320px;display:grid}.studio__stage{flex-direction:column;gap:12px;min-width:0;min-height:0;display:flex}.studio__well{min-height:0;padding:var(--spacing-3x);background:var(--color-well);border-radius:var(--radius-lg);flex:1;place-items:center;display:grid;overflow:hidden}.studio__sources{grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:6px;display:grid}.studio__source{aspect-ratio:1;background-color:var(--color-field);border-radius:var(--radius);box-shadow:0 0 0 1px var(--color-line);transition:box-shadow .12s var(--ease), background-color .12s var(--ease);background-position:50%;background-size:cover}.studio__source:hover{box-shadow:0 0 0 1px var(--color-line-strong)}.studio__source--current,.studio__source--current:hover{box-shadow:0 0 0 2px var(--color-bg), 0 0 0 3.5px var(--color-accent)}.studio__source--upload{color:var(--color-text-2);box-shadow:none;border:1px dashed var(--color-line-strong);place-items:center;display:grid}.studio__source--upload:hover{color:var(--color-text);background-color:var(--color-field-hi);box-shadow:none}.studio__source--over{color:var(--color-text);border-color:var(--color-text);background-color:var(--color-field-hi)}.studio__empty{color:var(--color-text-2);margin:0}.studio__strip{flex:none;grid-template-columns:repeat(12,minmax(0,72px));justify-content:center;gap:6px;margin:0;padding:0;list-style:none;display:grid}.studio__frame{aspect-ratio:1;min-width:0}.studio__frame--empty{border:1px dashed var(--color-line);border-radius:4px}.studio__thumb{background-color:var(--color-field);width:100%;height:100%;box-shadow:0 0 0 1px var(--color-line);transition:box-shadow .12s var(--ease);background-position:50%;background-size:cover;border-radius:4px;place-items:center;display:grid;overflow:hidden}.studio__thumb:hover{box-shadow:0 0 0 1px var(--color-line-strong)}.studio__thumb--current{box-shadow:0 0 0 2px var(--color-bg), 0 0 0 3.5px var(--color-accent)}.studio__thumb-name{font-family:var(--font-mono);color:var(--color-text-2);overflow-wrap:anywhere;text-align:center;padding:2px;font-size:9px}.studio__hint{text-align:center;color:var(--color-text-2);font-size:var(--font-size-sm);margin:0}.studio__hint-link{color:inherit;text-underline-offset:2px}.studio__hint-link:hover{color:var(--color-text)}.studio__panel{gap:var(--spacing-3x);min-height:0;padding-right:4px;padding-bottom:var(--spacing-3x);flex-direction:column;display:flex;overflow-y:auto}.studio__step-label{align-items:center;gap:var(--spacing-unit);display:inline-flex}.studio__step{background:var(--color-field-hi);width:18px;height:18px;color:var(--color-text-2);font-variant-numeric:tabular-nums;border-radius:50%;place-items:center;font-size:10px;font-weight:600;display:inline-grid}.studio__actions{align-items:center;gap:var(--spacing-2x);display:inline-flex}.studio__reroll{width:32px;color:var(--color-text)}.studio__params{margin-top:var(--spacing-unit);flex-direction:column;gap:10px;display:flex}.studio__param{font-size:var(--font-size-sm);flex-direction:column;gap:2px;display:flex}.studio__param .slider__input{opacity:.45;transition:opacity .12s var(--ease)}.studio__param:hover .slider__input,.studio__param--pinned .slider__input{opacity:1}.studio__param-head{align-items:baseline;gap:var(--spacing-unit);min-width:0;display:flex}.studio__param-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--color-text-2);flex:1;overflow:hidden}.studio__param--pinned .studio__param-name{color:var(--color-text);font-weight:500}.studio__param-value{font-variant-numeric:tabular-nums;color:var(--color-text-2)}.studio__param--pinned .studio__param-value{color:var(--color-text)}.studio__param-reset{text-align:right;text-transform:uppercase;letter-spacing:.04em;width:36px;color:var(--color-text);text-underline-offset:2px;flex:none;font-size:10px;text-decoration:underline}.studio__param-reroll{color:var(--color-text-3);opacity:0;transition:opacity .12s var(--ease), color .12s var(--ease), background .12s var(--ease);border-radius:4px;flex:none;align-self:center;padding:2px;display:inline-flex}.studio__param-reroll:hover{color:var(--color-text);background:var(--color-field-hi)}@media (hover:none){.studio__param-reroll{opacity:1}}.studio__param:hover .studio__param-reroll,.studio__param:focus-within .studio__param-reroll{opacity:1}.studio__param--unknown .slider__input::-webkit-slider-thumb{opacity:0}.studio__param--unknown .slider__input::-moz-range-thumb{opacity:0}.studio__param--choice{justify-content:space-between;align-items:center;gap:var(--spacing-unit);flex-direction:row}.studio__span{align-items:center;gap:var(--spacing-unit);grid-template-columns:36px 1fr;display:grid}.studio__span-label{color:var(--color-text-3)}@media (width<=1000px){.app{height:auto;min-height:100%;overflow:visible}.studio{grid-template-columns:1fr}.studio__well{flex:none;height:65vh}.studio__strip{grid-template-columns:repeat(6,minmax(0,1fr))}.studio__panel{padding-right:0;overflow:visible}}@media (width<=640px){.app{height:100dvh;overflow:hidden}.studio{flex-direction:column;gap:0;padding:0;display:flex}.studio__stage{min-height:0;padding:var(--spacing-unit) var(--spacing-unit) 10px;flex:1;gap:10px}.studio__well{touch-action:pan-y;background:0 0;border-radius:0;flex:1;height:auto;padding:0}.studio__strip{scrollbar-width:none;grid-template-columns:none;grid-auto-columns:52px;grid-auto-flow:column;justify-content:start;margin:-4px 0;padding:4px;overflow-x:auto}.studio__frame--empty,.studio__hint-keys{display:none}.studio__panel{max-height:46dvh;padding:var(--spacing-2x);border-top:1px solid var(--color-line);border-radius:14px 14px 0 0;flex:none;display:none;overflow-y:auto;box-shadow:0 -8px 24px #0000000f}.app--sheet .studio__panel{display:block}.studio__section{display:none}.studio__section--open{display:block}.studio__step{display:none}.studio__tabs{padding:6px var(--spacing-unit) max(6px, env(safe-area-inset-bottom));border-top:1px solid var(--color-line);background:var(--color-bg);flex:none;grid-template-columns:1fr 1fr auto 1fr 1fr;align-items:center;display:grid}.studio__tab{min-height:44px;color:var(--color-text-2);font-size:12px;font-weight:500}.studio__tab--current{color:var(--color-text);font-weight:600}.studio__tab--reroll{width:52px;height:52px;margin:0 var(--spacing-unit);background:var(--color-btn);color:var(--color-btn-text);border-radius:50%;place-items:center;display:grid}.btn{min-height:44px}.btn--square,.studio__reroll{width:44px;height:44px}.select__native{min-height:44px}.studio__param-reroll{margin:-8px -4px;padding:8px}.studio__param-reset{margin:-8px 0;padding:8px 0}.segmented__option{min-height:36px}.slider__input{height:28px}}
