/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial}::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.start{inset-inline-start:var(--spacing)}.grid{display:grid}.hidden{display:none}.table{display:table}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}}:root{--paper:#f1efe7;--plate:#eae7dc;--surface:#fcfbf7;--ink:#232118;--ink-soft:#555247;--mute:#8a8677;--line:#23211829;--line-soft:#23211814;--line-strong:#23211857;--accent:#e85d26;--accent-deep:#c7481a;--pine:#33684b;--pine-soft:#dfe9dd;--danger:#b93a24;--mono:var(--font-plex-mono), ui-monospace, "SF Mono", monospace;--r-card:6px;--r-ctl:4px;--shadow-key:0 2px 0 0 #2321181f;--shadow-key-sm:0 1px 0 0 #2321182e;--ease-out-quint:cubic-bezier(.23, 1, .32, 1);--ease-in-out-strong:cubic-bezier(.77, 0, .175, 1)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background-color:var(--paper);min-width:20rem;color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(circle,#23211812 1px,#0000 1.2px);background-size:22px 22px;margin:0;font-family:ui-sans-serif,-apple-system,PingFang SC,Microsoft YaHei,sans-serif}button,input{font:inherit}button{color:inherit}button,label,summary{-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}input:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}label:has(input:focus-visible){outline:2.5px solid var(--accent);outline-offset:2px}summary:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}canvas:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}a:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}button:disabled{cursor:not-allowed;opacity:.4}::selection{color:var(--ink);background:#e85d2638}.microlabel{font-family:var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--mute);font-size:.6rem;font-weight:500}.bead{--bead:#d8d4c8;aspect-ratio:1;background:radial-gradient(circle at 50% 42%, #00000038 0 18%, transparent 19%), radial-gradient(circle at 32% 28%, #ffffff61 0 26%, transparent 45%), var(--bead);border-radius:50%;width:1.15rem;display:inline-block;position:relative;box-shadow:inset 0 0 0 1px #00000021,inset 0 -2px 3px #00000024,0 1px 1px #0000001a}.bead-lg{width:1.7rem}.hole{aspect-ratio:1;background:radial-gradient(circle at 50% 45%,#23211813 0 24%,#0000 26%);border-radius:50%;display:inline-block;box-shadow:inset 0 1px 1px #2321180f}.app-shell{flex-direction:column;height:100svh;display:flex;overflow:hidden}.skip-link{z-index:100;border-radius:var(--r-ctl);background:var(--ink);color:var(--surface);padding:.7rem 1rem;text-decoration:none;position:fixed;inset-block-start:.75rem;inset-inline-start:.75rem;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}.app-header{z-index:30;border-block-end:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f1efe7eb;flex:none;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.5rem;min-height:4.5rem;padding-inline:clamp(1rem,3.6vw,3.75rem);display:grid;position:sticky;inset-block-start:0}.brand-button{cursor:pointer;letter-spacing:.01em;background:0 0;border:0;justify-self:start;align-items:center;gap:.65rem;min-height:2.75rem;padding:0 .5rem 0 0;font-size:1rem;font-weight:750;display:inline-flex}.brand-mark{background:var(--ink);border-radius:5px;grid-template-columns:repeat(2,.48rem);gap:.14rem;padding:.36rem;display:grid}.brand-mark i{aspect-ratio:1;background:var(--surface);border-radius:50%;width:.48rem}.brand-mark i:last-child{background:var(--accent)}.workflow-steps{align-items:center;gap:0;margin:0;padding:0;list-style:none;display:flex}.workflow-steps li{align-items:center;min-width:6.4rem;display:flex;position:relative}.workflow-steps li:not(:last-child):after{content:"";background:var(--line);flex:1;min-width:1.1rem;height:1px;margin-inline:.35rem .85rem}.workflow-steps li[data-complete=true]:not(:last-child):after{background:var(--pine)}.workflow-steps li>button{min-height:2.5rem;color:var(--mute);cursor:pointer;background:0 0;border:0;align-items:center;gap:.5rem;padding:0 .5rem 0 .15rem;font-size:.75rem;font-weight:600;transition-property:color;transition-duration:.15s;display:inline-flex}.workflow-steps li>button:disabled{cursor:default;opacity:1}.workflow-steps li>button span{aspect-ratio:1;border:1px solid var(--line);background:var(--surface);width:1.5rem;color:var(--mute);font-family:var(--mono);border-radius:50%;place-items:center;font-size:.64rem;transition-property:background-color,color,border-color,transform;transition-duration:.2s;transition-timing-function:ease;display:grid}.workflow-steps li>button:not(:disabled):hover{color:var(--ink)}.workflow-steps li>button:not(:disabled):hover span{border-color:var(--line-strong);color:var(--ink-soft);transform:scale(1.08)}.workflow-steps li[data-current=true]>button,.workflow-steps li[data-complete=true]>button{color:var(--ink)}.workflow-steps li[data-current=true]>button span{background:var(--ink);border-color:var(--ink);color:var(--surface)}.workflow-steps li[data-complete=true]>button span{background:var(--pine);border-color:var(--pine);color:#fff}.workflow-steps li[data-complete=true]>button span svg{animation:check-pop .24s var(--ease-out-quint)}.workspace{flex-direction:column;flex:1;width:min(100%,96rem);min-height:0;margin-inline:auto;padding:clamp(1rem,2.5vh,2rem) clamp(1rem,3.6vw,3.75rem);display:flex;overflow:hidden}.upload-view{flex:1;grid-template-columns:minmax(20rem,.95fr) minmax(26rem,1.05fr);align-items:center;gap:clamp(2.5rem,6vw,6rem);min-height:0;display:grid}.upload-copy{max-width:36rem}.eyebrow{color:var(--ink-soft);font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;align-items:center;gap:.55rem;margin:0 0 1.1rem;font-size:.68rem;font-weight:600;display:flex}.eyebrow-dots{gap:.24rem;display:inline-flex}.eyebrow-dots i{aspect-ratio:1;border-radius:50%;width:.42rem}.eyebrow-dots i:first-child{background:var(--pine)}.eyebrow-dots i:nth-child(2){background:var(--accent)}.eyebrow-dots i:nth-child(3){background:#c25b4c}.upload-copy h1{letter-spacing:-.025em;text-wrap:balance;max-width:15ch;margin:0;font-size:clamp(2.1rem,min(3.9vw,7svh),3.4rem);font-weight:760;line-height:1.16}.intro-text{max-width:30rem;color:var(--ink-soft);text-wrap:pretty;margin:1.35rem 0 1.8rem;font-size:.92rem;line-height:1.75}.drop-zone{border-radius:var(--r-card);border:1.5px dashed var(--line-strong);background:var(--surface);align-items:center;gap:1rem;width:fit-content;max-width:100%;padding:.55rem;transition-property:border-color,background-color,box-shadow;transition-duration:.15s;transition-timing-function:ease-out;display:flex}.drop-zone[data-dragging=true]{border-color:var(--accent);background:#e85d260f;box-shadow:0 0 0 3px #e85d2640}.upload-primary{border-radius:var(--r-ctl);background:var(--ink);min-height:3.1rem;color:var(--surface);cursor:pointer;transition-property:transform,background-color,box-shadow;transition-duration:.12s;transition-timing-function:var(--ease-out-quint);align-items:center;gap:.6rem;padding:0 1.2rem;font-size:.88rem;font-weight:650;display:inline-flex;position:relative;box-shadow:0 2px #23211866}.upload-primary:hover{background:#38352a}.upload-primary:active,.primary-action:active:not(:disabled),.secondary-action:active:not(:disabled),.sample-link:active,.stepper button:active,.zoom-control button:active{box-shadow:none;transform:translateY(1px)}.upload-primary input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.drop-meta{gap:.2rem;padding-inline-end:1rem;display:grid}.drop-copy{color:var(--ink-soft);font-size:.8rem;font-weight:620}.file-note{color:var(--mute);font-family:var(--mono);letter-spacing:.06em;font-size:.62rem}.feature-list{color:var(--ink-soft);flex-wrap:wrap;gap:.4rem 1.35rem;margin:1.2rem 0 0;padding:0;font-size:.76rem;font-weight:560;list-style:none;display:flex}.feature-list li{align-items:center;gap:.45rem;display:inline-flex}.feature-list svg{color:var(--pine)}.form-error{max-width:31rem;color:var(--danger);animation:rise-in .24s var(--ease-out-quint);margin:.75rem 0 0;font-size:.78rem;font-weight:620;line-height:1.5}.sample-link,.back-button{min-height:2.6rem;color:var(--accent-deep);cursor:pointer;background:0 0;border:0;align-items:center;gap:.5rem;margin-block-start:.6rem;padding:0 .35rem;font-size:.78rem;font-weight:650;transition-property:color,transform;transition-duration:.12s;display:inline-flex}.sample-link:hover,.back-button:hover{color:var(--accent)}.hero-board-wrap{justify-self:center;width:min(100%,40rem,122svh - 19.52rem);position:relative}.hero-board-card{border-radius:var(--r-card);border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow-key), 0 24px 60px #2321181a;padding:clamp(.7rem,1.4vw,1rem)}.hero-board-meta{justify-content:space-between;align-items:center;gap:1rem;min-height:2.1rem;padding:0 .25rem .55rem;display:flex}.hero-board-meta b{color:var(--ink);font-size:.78rem;font-weight:700}.hero-board-meta b i{font-family:var(--mono);letter-spacing:.13em;color:var(--mute);margin-inline-start:.55rem;font-size:.56rem;font-style:normal;font-weight:500}.hero-board-meta>span{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--mute);font-size:.66rem}.hero-board{border-radius:var(--r-ctl);background:var(--plate);grid-template-columns:repeat(19,1fr);gap:clamp(1px,.2vw,3px);padding:clamp(.6rem,1.3vw,.9rem);display:grid;box-shadow:inset 0 0 0 1px #23211821,inset 0 2px 6px #2321181a}.hero-board .bead{width:100%;animation:bead-pop .42s var(--ease-out-quint) both}.hero-board .hole{width:100%}.hero-board-footer{justify-content:space-between;align-items:center;gap:1rem;padding:.65rem .25rem 0;display:flex}.hero-legend{flex-wrap:wrap;gap:.35rem;display:flex}.legend-chip{border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--surface);min-height:1.9rem;color:var(--ink-soft);font-family:var(--mono);font-variant-numeric:tabular-nums;animation:swatch-in .46s var(--ease-out-quint) both;align-items:center;gap:.4rem;padding:0 .55rem 0 .35rem;font-size:.66rem;display:inline-flex}.legend-chip .bead{width:.95rem}.config-view,.editor-view{flex-direction:column;flex:1;min-height:0;display:flex}.view-heading,.editor-heading{flex:none;justify-content:space-between;align-items:end;gap:2rem;margin-block-end:1.1rem;display:flex}.view-heading h1,.editor-heading h1{letter-spacing:-.02em;text-wrap:balance;margin:0;font-size:clamp(1.45rem,2.2vw,1.85rem);font-weight:740;line-height:1.15}.view-heading p{color:var(--mute);margin:.4rem 0 0;font-size:.82rem}.back-button{min-height:1.9rem;margin:0 0 .45rem}.source-chip{border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--surface);min-width:13rem;max-width:20rem;box-shadow:var(--shadow-key-sm);align-items:center;gap:.65rem;padding:.4rem .7rem .4rem .4rem;display:flex}.source-chip img{aspect-ratio:1;object-fit:cover;outline:1px solid var(--line);outline-offset:-1px;border-radius:3px;width:2.5rem}.source-chip span{gap:.15rem;min-width:0;display:grid}.source-chip b{text-overflow:ellipsis;white-space:nowrap;font-size:.76rem;overflow:hidden}.source-chip small{color:var(--mute);font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:.62rem}.surface-card{border-radius:var(--r-card);border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow-key)}.config-layout{flex:1;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(25rem,1.35fr) minmax(22rem,.65fr);align-items:stretch;gap:1.25rem;min-height:0;display:grid}.crop-panel{flex-direction:column;min-height:0;padding:0;display:flex}.panel-label-row{border-block-end:1px solid var(--line-soft);justify-content:space-between;align-items:center;gap:1rem;padding:.7rem 1rem;font-size:.8rem;font-weight:700;display:flex}.panel-label-row span i{font-family:var(--mono);letter-spacing:.13em;color:var(--mute);margin-inline-start:.6rem;font-size:.58rem;font-style:normal;font-weight:500}.panel-label-row b{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink-soft);font-size:.72rem;font-weight:600}.crop-stage{border-radius:var(--r-ctl);background-color:var(--plate);background-image:radial-gradient(circle at 50% 45%,#23211817 0 2px,#0000 2.6px);background-size:14px 14px;flex:1;grid-template-rows:minmax(0,1fr) auto;place-items:center;gap:.9rem;min-height:0;margin:.8rem;padding:clamp(1.1rem,2.5vh,2.2rem);display:grid;overflow:hidden;box-shadow:inset 0 0 0 1px #2321181f,inset 0 2px 6px #23211814}.crop-frame{place-items:center;width:auto;max-width:100%;height:100%;max-height:100%;display:grid;position:relative;box-shadow:0 0 0 1px #fcfbf7e6,0 14px 34px #23211847}.crop-frame canvas{object-fit:contain;outline-offset:-1px;outline:1px solid #0000001a;width:100%;max-width:100%;height:100%;max-height:100%;display:block}.crop-corner{border-color:var(--surface);filter:drop-shadow(0 1px 1px #00000059);border-style:solid;width:1.2rem;height:1.2rem;position:absolute}.crop-corner-a{border-width:2px 0 0 2px;inset:-3px auto auto -3px}.crop-corner-b{border-width:2px 2px 0 0;inset:-3px -3px auto auto}.crop-corner-c{border-width:0 0 2px 2px;inset:auto auto -3px -3px}.crop-corner-d{border-width:0 2px 2px 0;inset:auto -3px -3px auto}.crop-stage p{color:var(--mute);align-items:center;gap:.45rem;margin:0;font-size:.7rem;display:flex}.settings-panel{flex-direction:column;min-height:0;display:flex;overflow:hidden}.settings-scroll{overscroll-behavior:contain;flex:1;min-height:0;padding:1.1rem 1.1rem .4rem;overflow-y:auto}.settings-footer{border-block-start:1px solid var(--line-soft);flex:none;padding:.85rem 1.1rem 1.05rem}.setting-group{border:0;margin:0;padding:0 0 1.35rem}.setting-group+.setting-group{border-block-start:1px solid var(--line-soft);padding-block-start:1.35rem}.setting-group legend{justify-content:space-between;align-items:center;width:100%;margin-block-end:.85rem;padding:0;font-size:.8rem;font-weight:700;display:flex}.setting-group legend span{font-family:var(--mono);letter-spacing:.13em;color:var(--mute);font-size:.58rem;font-weight:500}.preset-grid{grid-template-columns:repeat(2,1fr);gap:.55rem;display:grid}.preset-grid button{text-align:start;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);cursor:pointer;gap:.18rem;min-height:3.4rem;padding:.6rem .8rem;transition-property:border-color,box-shadow;transition-duration:.13s;display:grid;position:relative}.preset-grid button:hover{border-color:var(--line-strong)}.preset-grid button[data-active=true]{border-color:var(--ink);box-shadow:var(--shadow-key-sm)}.preset-grid button[data-active=true]:after{content:"";aspect-ratio:1;background:var(--accent);border-radius:50%;width:.4rem;position:absolute;inset-block-start:.55rem;inset-inline-end:.55rem}.preset-grid b{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:.76rem;font-weight:600}.preset-grid span{color:var(--mute);font-size:.64rem}.custom-size-row{animation:rise-in .24s var(--ease-out-quint);align-items:center;gap:.6rem;margin-block-start:.7rem;display:flex}.custom-size-row>span{color:var(--mute);font-family:var(--mono)}.stepper{border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);box-shadow:var(--shadow-key-sm);align-items:stretch;display:inline-flex;overflow:hidden}.stepper button{width:2.25rem;min-height:2.5rem;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;place-items:center;transition-property:background-color;transition-duration:.1s;display:grid}.stepper button:hover{background:#2321180d}.stepper input{border:0;border-inline:1px solid var(--line-soft);text-align:center;width:3.1rem;color:var(--ink);font-family:var(--mono);font-variant-numeric:tabular-nums;-webkit-appearance:textfield;appearance:textfield;background:0 0;font-size:.8rem}.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}.stepper input:focus-visible{outline-offset:-2px}.stepper output{border-inline:1px solid var(--line-soft);min-width:3.4rem;font-family:var(--mono);font-variant-numeric:tabular-nums;place-items:center;font-size:.72rem;display:grid}.range-field+.range-field{margin-block-start:1rem}.range-field>label{color:var(--ink-soft);justify-content:space-between;align-items:center;gap:1rem;font-size:.72rem;font-weight:620;display:flex}.range-field>label i{font-family:var(--mono);letter-spacing:.12em;color:var(--mute);margin-inline-start:.45rem;font-size:.56rem;font-style:normal;font-weight:500}.range-field output{font-family:var(--mono);color:var(--ink);font-variant-numeric:tabular-nums;font-size:.72rem}.slider-wrap{margin-block-start:.2rem;padding-block-end:.72rem;position:relative}.slider-wrap input[type=range]{--fill:50%;-webkit-appearance:none;appearance:none;cursor:pointer;background:0 0;width:100%;height:1.3rem;margin:0}.slider-wrap input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--ink) var(--fill), #23211829 var(--fill));border-radius:2px;height:4px}.slider-wrap input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--surface);border:1.5px solid var(--ink);border-radius:50%;width:1.02rem;height:1.02rem;margin-top:calc(2px - .51rem);transition:transform .1s;box-shadow:0 1px 0 1px #23211829}.slider-wrap input[type=range]:active::-webkit-slider-thumb{transform:scale(1.12)}.slider-wrap input[type=range]::-moz-range-track{background:#23211829;border-radius:2px;height:4px}.slider-wrap input[type=range]::-moz-range-progress{background:var(--ink);border-radius:2px;height:4px}.slider-wrap input[type=range]::-moz-range-thumb{background:var(--surface);border:1.5px solid var(--ink);border-radius:50%;width:1.02rem;height:1.02rem}.slider-wrap .ticks{pointer-events:none;justify-content:space-between;display:flex;position:absolute;inset-block-end:0;inset-inline:.5rem}.slider-wrap .ticks i{background:#23211838;width:1px;height:5px}.slider-wrap .ticks i:nth-child(4n+1){height:8px}.color-limit,.generation-mode{border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--plate);gap:2px;padding:3px;display:grid;box-shadow:inset 0 1px 2px #23211814}.color-limit{grid-template-columns:repeat(5,1fr)}.generation-mode{grid-template-columns:repeat(2,1fr)}.setting-hint{color:var(--mute);margin:.6rem 0 0;font-size:.66rem;line-height:1.55}.segment-button{min-height:2.15rem;color:var(--mute);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:3px;justify-content:center;align-items:center;padding:.35rem .65rem;font-size:.7rem;font-weight:620;transition-property:color;transition-duration:.12s;display:inline-flex;position:relative}.segment-button:hover,.segment-button[data-active=true]{color:var(--ink)}.segment-pill{background:var(--surface);border-radius:3px;position:absolute;inset:0;box-shadow:0 1px #2321182e,inset 0 0 0 1px #23211821}.segment-content{z-index:1;justify-content:center;align-items:center;gap:.4rem;display:inline-flex;position:relative}.seg-dot{aspect-ratio:1;background:#23211833;border-radius:50%;width:.4rem;transition:background-color .15s}.segment-button[data-active=true] .seg-dot{background:var(--accent)}.toggle-row{cursor:pointer;justify-content:space-between;align-items:center;gap:1rem;min-height:3.6rem;margin-block-start:.75rem;padding:.6rem 0;display:flex;position:relative}.toggle-row span{gap:.2rem;display:grid}.toggle-row b{font-size:.76rem}.toggle-row small{color:var(--mute);font-size:.66rem;line-height:1.45}.toggle-row input{opacity:0;pointer-events:none;position:absolute}.toggle-row i{border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--plate);flex:none;width:3.2rem;height:1.65rem;transition-property:background-color,border-color;transition-duration:.16s;position:relative;box-shadow:inset 0 1px 3px #23211826}.toggle-row i:after{content:"";background:var(--surface);width:calc(50% - 3px);height:calc(100% - 4px);transition-property:transform;transition-duration:.16s;transition-timing-function:var(--ease-out-quint);background-image:linear-gradient(90deg,#0000 42%,#23211821 42% 46%,#0000 46% 54%,#23211821 54% 58%,#0000 58%);border:1px solid #23211833;border-radius:3px;position:absolute;inset-block-start:2px;inset-inline-start:2px;box-shadow:0 1px 1px #23211830}.toggle-row input:checked+i{background:var(--pine);border-color:var(--pine)}.toggle-row input:checked+i:after{transform:translate(calc(100% + 2px))}.build-summary{grid-template-columns:repeat(3,1fr);gap:.5rem;margin:0;padding:0 0 .85rem;display:grid}.build-summary span{border-radius:var(--r-ctl);background:var(--plate);gap:.15rem;padding:.5rem .65rem;display:grid}.build-summary b{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:.86rem;font-weight:600}.build-summary small{color:var(--mute);font-family:var(--mono);letter-spacing:.1em;font-size:.56rem}.primary-action,.secondary-action{border-radius:var(--r-ctl);cursor:pointer;min-height:2.9rem;transition-property:transform,background-color,box-shadow,border-color;transition-duration:.12s;transition-timing-function:var(--ease-out-quint);border:1px solid #0000;justify-content:center;align-items:center;gap:.55rem;padding-inline:1rem;font-size:.8rem;font-weight:650;display:inline-flex}.primary-action{background:var(--ink);width:100%;color:var(--surface);box-shadow:0 2px #23211866}.primary-action:hover:not(:disabled){background:#38352a}.export-button{background:var(--accent);box-shadow:0 2px 0 0 var(--accent-deep)}.export-button:hover:not(:disabled){background:#f0672f}.secondary-action{background:var(--surface);color:var(--ink);border-color:var(--line);box-shadow:var(--shadow-key-sm)}.secondary-action:hover:not(:disabled){border-color:var(--line-strong)}.editor-heading{align-items:center}.editor-actions{align-items:center;gap:.65rem;display:flex}.editor-actions .primary-action{width:auto}.editor-layout{flex:1;grid-template-rows:minmax(0,1fr);grid-template-columns:5.1rem minmax(30rem,1fr) minmax(16.5rem,18.5rem);align-items:stretch;gap:1rem;min-height:0;display:grid}.tool-rail{flex-direction:column;justify-content:space-between;gap:.8rem;min-height:0;padding:.45rem;display:flex;overflow-y:auto}.tool-group{border:1px solid var(--line-soft);background:var(--plate);border-radius:5px;gap:.25rem;padding:.25rem;display:grid}.tool-group button{border-radius:var(--r-ctl);min-height:3.5rem;color:var(--mute);cursor:pointer;background:0 0;border:0;align-content:center;place-items:center;gap:.28rem;padding:.4rem .2rem;font-size:.6rem;font-weight:620;transition-property:color,background-color;transition-duration:.12s;display:grid;position:relative}.tool-group button:hover:not(:disabled){color:var(--ink);background:#fcfbf78c}.tool-group button[data-active=true]{color:var(--ink)}.tool-group button[data-active=true]:after{content:"";z-index:1;aspect-ratio:1;background:var(--accent);border-radius:50%;width:.32rem;position:absolute;inset-block-start:.32rem;inset-inline-end:.32rem}.tool-group button>svg,.tool-group button>span{z-index:1;position:relative}.tool-pill{border-radius:var(--r-ctl);background:var(--surface);position:absolute;inset:0;box-shadow:0 1px #23211833,inset 0 0 0 1px #23211824}.board-panel{flex-direction:column;min-width:0;min-height:0;padding:.7rem;display:flex}.board-toolbar{justify-content:space-between;align-items:center;gap:1rem;min-height:3rem;padding:0 .15rem .65rem;display:flex}.view-segments{border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--plate);align-items:center;gap:2px;padding:3px;display:flex;box-shadow:inset 0 1px 2px #23211814}.bead-view-icon{aspect-ratio:1;background:var(--pine);border-radius:50%;width:.72rem;box-shadow:inset 0 0 0 1px #00000026}.code-view-icon{font-family:var(--mono);font-size:.56rem;font-weight:600}.zoom-control{border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);box-shadow:var(--shadow-key-sm);color:var(--ink-soft);align-items:stretch;display:flex;overflow:hidden}.zoom-control button{cursor:pointer;background:0 0;border:0;place-items:center;width:2.3rem;min-height:2.3rem;transition-property:background-color;transition-duration:.1s;display:grid}.zoom-control button:hover{color:var(--ink);background:#2321180d}.zoom-control output{border-inline:1px solid var(--line-soft);min-width:3.3rem;font-family:var(--mono);font-variant-numeric:tabular-nums;place-items:center;font-size:.68rem;display:grid}.board-scroll{overscroll-behavior:contain;border-radius:var(--r-ctl);background-color:var(--plate);background-image:radial-gradient(circle at 50% 45%,#23211817 0 2px,#0000 2.6px);background-size:14px 14px;flex:1;place-items:center;min-height:0;padding:clamp(1rem,3vw,2.2rem);display:grid;overflow:auto;box-shadow:inset 0 0 0 1px #2321181f,inset 0 2px 6px #23211814}.board-scroll[data-tool=pan]{cursor:grab}.board-scroll[data-tool=pan]:active{cursor:grabbing}.board-scroll:not([data-tool=pan]){cursor:crosshair}.pattern-canvas{touch-action:none;min-width:50%;max-width:none;height:auto;image-rendering:pixelated;display:block;box-shadow:0 0 0 1px #23211833,0 14px 30px #23211838}.board-caption{min-height:2.4rem;color:var(--mute);font-family:var(--mono);font-variant-numeric:tabular-nums;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem 1.4rem;padding:.7rem .3rem 0;font-size:.62rem;display:flex}.board-caption span+span{position:relative}.board-caption span+span:before{content:"·";color:var(--line-strong);position:absolute;inset-inline-start:-.85rem}.palette-panel{flex-direction:column;min-width:0;min-height:0;padding:.9rem;display:flex}.panel-heading-row{justify-content:space-between;align-items:start;gap:1rem;display:flex}.panel-heading-row h2{letter-spacing:-.01em;margin:.15rem 0 0;font-size:.95rem;font-weight:740}.panel-heading-row>span{border:1px solid var(--line);background:var(--surface);min-height:1.7rem;color:var(--ink-soft);font-family:var(--mono);font-variant-numeric:tabular-nums;border-radius:3px;place-items:center;padding-inline:.5rem;font-size:.62rem;display:grid}.panel-kicker{font-family:var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--mute);margin:0;font-size:.56rem;font-weight:500}.active-color-card{border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--plate);align-items:center;gap:.7rem;min-height:3.8rem;margin-block:.9rem;padding:.55rem .7rem;display:flex}.active-color-card span{flex:1;gap:.12rem;min-width:0;display:grid}.active-color-card b{font-size:.77rem}.active-color-card small{color:var(--mute);font-family:var(--mono);font-size:.6rem}.active-color-card svg{color:var(--pine)}.color-stats{overscroll-behavior:contain;flex:1;align-content:start;gap:.1rem;min-height:0;margin-inline:-.2rem;padding:.2rem;display:grid;overflow-y:auto}.color-stats button{border-radius:var(--r-ctl);cursor:pointer;text-align:start;background:0 0;border:1px solid #0000;grid-template-columns:auto 1fr auto;align-items:center;gap:.6rem;min-height:2.9rem;padding:.4rem .5rem;transition-property:background-color,border-color;transition-duration:.1s;display:grid}.color-stats button:hover{background:#2321180b}.color-stats button[data-active=true]{background:var(--surface);border-color:var(--line);box-shadow:var(--shadow-key-sm)}.color-stats span{gap:.06rem;display:grid}.color-stats b{font-size:.72rem}.color-stats small{color:var(--mute);font-family:var(--mono);font-size:.56rem}.color-stats strong{color:var(--ink-soft);font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:.68rem;font-weight:500}.all-colors{border-block-start:1px solid var(--line-soft);margin-block-start:.65rem}.all-colors summary{cursor:pointer;min-height:2.6rem;color:var(--mute);justify-content:space-between;align-items:center;font-size:.68rem;font-weight:620;list-style:none;display:flex}.all-colors summary::-webkit-details-marker{display:none}.all-colors summary svg{transition-property:transform;transition-duration:.15s}.all-colors[open] summary svg{transform:rotate(180deg)}.swatch-grid{overscroll-behavior:contain;grid-template-columns:repeat(8,1fr);gap:.35rem;max-height:11rem;padding:.15rem .15rem .8rem;display:grid;overflow-y:auto}.bead-btn{--bead:#d8d4c8;aspect-ratio:1;cursor:pointer;background:radial-gradient(circle at 50% 42%, #00000038 0 18%, transparent 19%), radial-gradient(circle at 32% 28%, #ffffff61 0 26%, transparent 45%), var(--bead);width:100%;transition:transform .1s var(--ease-out-quint);border:0;border-radius:50%;padding:0;box-shadow:inset 0 0 0 1px #00000021,inset 0 -2px 3px #00000024,0 1px 1px #0000001a}.bead-btn:hover{transform:scale(1.08)}.bead-btn[data-active=true]{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--accent)}.regenerate-action{border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);min-height:2.7rem;color:var(--ink-soft);cursor:pointer;box-shadow:var(--shadow-key-sm);justify-content:center;align-items:center;gap:.45rem;margin-block-start:auto;padding:.6rem .75rem;font-size:.7rem;font-weight:630;transition-property:border-color,transform,box-shadow;transition-duration:.12s;display:flex}.regenerate-action:hover:not(:disabled){border-color:var(--line-strong)}.regenerate-action:active:not(:disabled){box-shadow:none;transform:translateY(1px)}.sr-only,.sr-status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:fixed;overflow:hidden}.busy-pill{z-index:50;border-radius:var(--r-ctl);background:var(--ink);max-width:calc(100% - 2rem);min-height:2.7rem;color:var(--surface);text-align:center;align-items:center;gap:.6rem;padding:.6rem 1rem;font-size:.76rem;display:flex;position:fixed;inset-block-end:calc(1rem + env(safe-area-inset-bottom));inset-inline-start:50%;transform:translate(-50%);box-shadow:0 3px #2321184d,0 12px 30px #23211840}.busy-pill>span{aspect-ratio:1;border:2px solid #ffffff47;border-block-start-color:var(--surface);border-radius:50%;width:.85rem;animation:.8s linear infinite busy-spin}@keyframes busy-spin{to{transform:rotate(360deg)}}@keyframes bead-pop{0%{opacity:0;transform:scale(.3)}70%{opacity:1;transform:scale(1.12)}to{opacity:1;transform:scale(1)}}@keyframes swatch-in{0%{opacity:0;transform:translateY(.6rem)scale(.95)}}@keyframes rise-in{0%{opacity:0;transform:translateY(.4rem)}}@keyframes check-pop{0%{opacity:0;transform:scale(.4)}}@media (max-width:78rem){.app-shell{height:auto;min-height:100svh;overflow:visible}.workspace{flex:none;padding-block-end:4rem;display:block;overflow:visible}.upload-view{min-height:calc(100svh - 10.5rem)}.config-view,.editor-view{display:block}.config-layout{grid-template-rows:none;align-items:start}.crop-panel{min-height:42rem}.crop-stage{min-height:36rem}.crop-frame{height:min(33rem,100%);max-height:33rem}.crop-frame canvas{max-height:33rem}.settings-panel{display:block;overflow:visible}.settings-scroll{padding:1.1rem 1.1rem .4rem;overflow:visible}.hero-board-wrap{width:min(100%,40rem)}.editor-layout{grid-template-rows:none;grid-template-columns:4.8rem minmax(28rem,1fr)}.board-panel{min-height:40rem}.board-scroll{min-height:30rem}.tool-rail{overflow:visible}.swatch-grid{max-height:none;overflow:visible}.palette-panel{grid-column:1/-1;grid-template-columns:minmax(14rem,.7fr) minmax(26rem,1.3fr);gap:0 1.2rem;display:grid}.panel-heading-row,.active-color-card,.all-colors,.regenerate-action{grid-column:1}.color-stats{grid-area:1/2/6;grid-template-columns:repeat(2,1fr);max-height:17rem}}@media (max-width:62rem){.app-header{grid-template-columns:1fr auto;padding-block-start:.45rem}.workflow-steps{order:3;grid-column:1/-1;justify-self:center;padding-block-end:.75rem}.upload-view{grid-template-columns:1fr;gap:3.5rem;padding-block:1.5rem 3rem}.upload-copy{max-width:44rem}.hero-board-wrap{max-width:36rem}.config-layout{grid-template-columns:1fr}.crop-panel{min-height:38rem}.crop-stage{min-height:32rem}.settings-panel{justify-self:center;width:100%;max-width:42rem}}@media (max-width:48rem){.workspace{padding-block-start:1.25rem}.view-heading,.editor-heading{flex-direction:column;align-items:start;gap:1rem}.source-chip{align-self:stretch;max-width:none}.editor-actions{width:100%}.editor-actions button{flex:1}.editor-layout{grid-template-columns:1fr}.tool-rail{flex-direction:row;padding:.4rem;overflow-x:auto}.tool-group{display:flex}.tool-group button{min-width:3.9rem;min-height:3.4rem}.board-panel{min-height:37rem}.board-scroll{min-height:29rem}.palette-panel{display:block}.color-stats{grid-template-columns:repeat(2,1fr);max-height:20rem;display:grid}}@media (max-width:38rem){.app-header{gap:.6rem}.workflow-steps{width:100%}.workflow-steps li{flex:1;min-width:0}.workflow-steps li>button{flex:1;justify-content:center;padding:0 .25rem}.workflow-steps li b{font-size:.68rem}.upload-copy h1{font-size:clamp(1.9rem,8.5vw,2.8rem)}.drop-zone{flex-wrap:wrap;gap:.4rem;width:100%;padding:.45rem}.upload-primary{width:100%}.drop-meta{text-align:center;justify-items:center;width:100%;padding:.15rem .35rem .4rem}.crop-panel{min-height:28rem}.crop-stage{min-height:24rem;margin:.6rem;padding:1rem}.settings-scroll{padding:1rem 1rem .4rem}.settings-footer{padding:.8rem 1rem 1rem}.preset-grid{grid-template-columns:1fr}.custom-size-row{flex-wrap:wrap}.editor-heading h1,.view-heading h1{font-size:1.4rem}.board-toolbar{flex-direction:column;align-items:stretch;gap:.6rem}.view-segments{width:100%}.view-segments .segment-button{flex:1}.zoom-control{align-self:center}.board-panel{min-height:31rem;padding:.5rem}.board-scroll{min-height:23rem;padding:1rem}.color-stats{grid-template-columns:1fr}.build-summary{gap:.4rem}.build-summary b{font-size:.76rem}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important}.upload-primary:active,.primary-action:active,.secondary-action:active,.sample-link:active,.stepper button:active,.zoom-control button:active,.regenerate-action:active,.bead-btn:hover{transform:none}}@media (forced-colors:active){button,.surface-card,.source-chip,.drop-zone{border:1px solid buttontext}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}
