:root{color-scheme:light dark;--silver: #e4eae9;--glass: #f6f8f7;--line: #b3c1bf;--ink: #14262b;--ink-soft: #46595d;--peacock: #0b4f52;--teal: #0b4f52;--peacock-deep: #073436;--mist: #d6e6e4;--turmeric: #f2b01e;--turmeric-deep: #d99a0b;--sindoor: #a52019;--sindoor-soft: #fbe3e0;--display: "Rozha One", "Didot", Georgia, serif;--body: "Hind", "Avenir Next", "Segoe UI", sans-serif;--gutter: clamp(16px, 2.4vw, 32px)}@media(prefers-color-scheme:dark){:root{--silver: #101c1f;--glass: #18272a;--line: #35494c;--ink: #e7eeec;--ink-soft: #a8bab9;--teal: #74cbc8;--sindoor: #ffb0a8;--sindoor-soft: #40201d}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--silver);color:var(--ink);font:400 1rem/1.5 var(--body)}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:3px solid var(--turmeric-deep);outline-offset:2px}h1,h2,p,ul,ol,fieldset{margin:0;padding:0}ul,ol{list-style:none}fieldset{border:0;min-width:0}[hidden]{display:none!important}.app{display:grid;grid-template-columns:minmax(0,1fr);min-height:100dvh}.stage{display:flex;flex-direction:column;gap:12px;padding:16px var(--gutter);background:var(--peacock-deep);color:#f1f6f5}.controls{display:flex;flex-direction:column;min-width:0;padding-top:8px}.steps{flex:1;padding:0 var(--gutter) 16px}.masthead{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 14px}.masthead h1{font:400 1.9rem/1.1 var(--display);letter-spacing:.01em}.masthead p{color:var(--mist);font-size:.95rem}.mirror{position:relative;flex:none;display:flex;align-items:center;justify-content:center;height:46dvh;border-radius:999px 999px 10px 10px/200px 200px 10px 10px;background:var(--peacock);box-shadow:inset 0 0 0 1px #2d7d80,inset 0 0 0 6px var(--peacock-deep),inset 0 0 0 7px #2d7d80;overflow:hidden}.mirror:has(>img),.mirror:has(>.compare){border-radius:10px;box-shadow:none;background:transparent}.mirror>img{display:block;max-width:100%;max-height:100%;object-fit:contain}.mirror-note{padding:24px;text-align:center}.mirror-note .hint{color:var(--mist)}.dropzone{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:0;background:none;color:inherit}.dropzone:hover,.dropzone.dragging{background:#116468}.dropzone-title{font:400 clamp(1.8rem,5vw,2.6rem)/1.1 var(--display)}.dropzone-hint{color:var(--mist)}.compare{--split: 50%;position:relative;max-width:100%;max-height:100%;display:flex;overflow:hidden;border-radius:10px}.compare-after{display:block;max-width:100%;max-height:46dvh;object-fit:contain}.compare-before{position:absolute;top:0;right:0;bottom:0;left:0;clip-path:inset(0 calc(100% - var(--split)) 0 0);background:var(--peacock-deep)}.compare-before img{width:100%;height:100%;object-fit:contain}.compare-line{position:absolute;top:0;bottom:0;left:var(--split);width:3px;margin-left:-1.5px;background:linear-gradient(#fff,#c9d6d5 50%,#fff);box-shadow:0 0 10px #00000073;pointer-events:none}.compare-handle{position:absolute;top:50%;left:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border:3px solid #fff;border-radius:50%;background:var(--peacock-deep);box-shadow:0 2px 8px #00000073}.compare-handle:before{content:"";position:absolute;top:11px;right:8px;bottom:11px;left:8px;border-inline:3px solid #fff}.compare-tag{position:absolute;bottom:10px;padding:0 8px;border-radius:4px;background:#073436d9;color:#fff;font-size:.85rem;pointer-events:none}.compare-tag-before{left:10px}.compare-tag-after{right:10px}.compare input[type=range]{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.compare:has(input:focus-visible){outline:3px solid var(--turmeric);outline-offset:2px}.stage-foot{display:flex;flex-direction:column;gap:10px}.stage-foot:empty{display:none}.pipeline{display:flex;flex-wrap:wrap;gap:4px 20px;font-size:.95rem}.pipeline-step{display:flex;align-items:center;gap:8px;color:var(--mist)}.pipeline-step.active{color:#fff;font-weight:600}.pipeline-step.failed{color:#ffc9c3;font-weight:600}.pipeline-dot{width:10px;height:10px;border:2px solid var(--mist);border-radius:50%}.pipeline-step.done .pipeline-dot{border-color:var(--turmeric);background:var(--turmeric)}.pipeline-step.active .pipeline-dot{border-color:var(--turmeric);animation:pulse 1.2s ease-in-out infinite}.pipeline-step.failed .pipeline-dot{border-color:#ffc9c3;background:#ffc9c3}@keyframes pulse{50%{background:var(--turmeric)}}.stage-error{padding:8px 12px;border-radius:6px;background:var(--sindoor-soft);color:var(--sindoor)}.catalog-error{margin:0 var(--gutter) 8px}.stage-actions{display:flex;flex-wrap:wrap;gap:8px}.stage-actions:empty{display:none}.on-stage{min-height:44px;padding:0 18px;border:1px solid var(--mist);border-radius:6px;background:none;color:#fff}.on-stage:hover{background:var(--peacock)}.primary-on-stage{border-color:#fff;background:#fff;color:var(--peacock-deep);font-weight:600}.primary-on-stage:hover{background:var(--mist)}.compiled summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--mist)}.compiled pre{max-height:240px;margin:0;padding:12px;overflow:auto;border-radius:6px;background:var(--peacock);font-size:.8rem;white-space:pre-wrap;overflow-wrap:anywhere}.step{border-bottom:1px solid var(--line)}.step h2{font:inherit}.step h2 button{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:12px;width:100%;min-height:56px;padding:6px 0;border:0;background:none;text-align:left}.step-num{font:400 1.35rem/1 var(--display);color:var(--teal);min-width:1ch}.step-title{font-weight:600;font-size:1.05rem}.step-summary{justify-self:end;max-width:100%;overflow:hidden;color:var(--ink-soft);text-overflow:ellipsis;white-space:nowrap}.step-body{padding-bottom:20px}.hint{color:var(--ink-soft);font-size:.92rem}.field{margin-top:16px}.field-label{display:block;padding:0;font-weight:600}.field-error{flex-basis:100%;color:var(--sindoor)}textarea,select,input[type=search]{width:100%;min-height:44px;padding:8px 12px;border:1px solid var(--ink-soft);border-radius:6px;background:var(--glass);-webkit-appearance:none;-moz-appearance:none;appearance:none}select{padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);background-position:right 16px center,right 11px center;background-size:5px 5px;background-repeat:no-repeat}textarea{display:block;margin-top:4px;resize:vertical}.quiet{min-height:44px;min-width:44px;padding:0 8px;border:0;background:none;color:var(--teal);font-weight:600;text-decoration:underline}.picker{display:flex;flex-direction:column;gap:10px}.picker-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.options{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:6px}.options:empty{min-height:1000px}.option{display:block;width:100%;height:100%;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:6px;background:var(--glass);text-align:left}.option:hover:not(:disabled){border-color:var(--teal)}.option:disabled{opacity:.55}.option.active{border-color:var(--teal);box-shadow:inset 4px 0 0 var(--teal),0 0 0 1px var(--teal)}.option-name{display:block;font-weight:600;line-height:1.3}.option-desc{display:block;color:var(--ink-soft);font-size:.9rem;line-height:1.35}.tag{margin-left:8px;color:var(--teal);font-size:.82rem;font-weight:500;white-space:nowrap}.more{min-height:44px;border:1px solid var(--ink-soft);border-radius:6px;background:none}.more:hover{background:var(--glass)}.blend{display:flex;flex-direction:column;gap:2px}.blend-head{display:flex;align-items:center;gap:8px;font-weight:600}.blend-head span:first-child{flex:1;min-width:0}.blend-pct{font-variant-numeric:tabular-nums}.blend input[type=range]{display:block;width:100%;height:32px;margin:0;accent-color:var(--teal)}.shapes{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:6px}.shapes legend,.sizes legend{margin-bottom:6px}.shape{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;min-height:84px;padding:8px 4px 4px;border:1px solid var(--line);border-radius:6px;background:var(--glass);font-variant-numeric:tabular-nums}.shape-box{--unit: calc(44px/max(var(--w), var(--h))) ;width:calc(var(--w) * var(--unit));height:calc(var(--h) * var(--unit));border:2px solid var(--ink-soft);border-radius:2px}.shape.active,.size.active{border-color:var(--teal);box-shadow:0 0 0 1px var(--teal);font-weight:600}.shape.active .shape-box{border-color:var(--teal);background:var(--teal)}.sizes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:16px}.sizes legend{grid-column:1 / -1}.size{min-height:56px;padding:4px;border:1px solid var(--line);border-radius:6px;background:var(--glass)}.size small{display:block;color:var(--ink-soft);font-size:.85rem;font-weight:400}.toggles{display:flex;flex-direction:column}.toggle{position:relative;display:flex;align-items:center;gap:12px;min-height:56px;cursor:pointer}.toggle input{position:absolute;width:44px;height:26px;margin:0;opacity:0}.toggle-track{position:relative;flex:none;width:44px;height:26px;border:1px solid var(--ink-soft);border-radius:13px;background:var(--glass);transition:background .15s}.toggle-track:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--ink-soft);transition:transform .15s}.toggle input:checked+.toggle-track{border-color:var(--peacock);background:var(--peacock)}.toggle input:checked+.toggle-track:after{background:#fff;transform:translate(18px)}.toggle input:focus-visible+.toggle-track{outline:3px solid var(--turmeric-deep);outline-offset:2px}.toggle-title{display:block;font-weight:600}.reference{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.reference-thumb{width:56px;height:56px;border-radius:6px;object-fit:cover}.reference-text{flex:1;min-width:160px}.action{position:sticky;bottom:0;z-index:2;display:flex;flex-direction:column;gap:2px;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--silver)}.action .hint{text-align:center}.submit{width:100%;min-height:52px;border:0;border-radius:6px;background:var(--turmeric);color:#14262b;font-size:1.1rem;font-weight:600}.submit:hover:not(:disabled){background:var(--turmeric-deep)}.submit:disabled{background:var(--line);color:var(--ink-soft)}@media(min-width:600px)and (orientation:portrait){.mirror{height:44dvh}.compare-after{max-height:44dvh}}@media(min-width:900px){.app{grid-template-columns:minmax(0,1.15fr) minmax(380px,1fr);height:100dvh}.stage,.controls{height:100dvh;min-height:0;overflow-y:auto}.stage{padding-block:20px}.mirror{height:auto;flex:1 1 0;min-height:240px}.compare-after{max-height:calc(100dvh - 190px)}.steps{overflow-y:auto}}@media(min-width:1500px){.app{grid-template-columns:minmax(0,1fr) 560px}}@media(orientation:landscape)and (max-height:520px){.app{grid-template-columns:minmax(0,1fr) minmax(0,1fr);height:100dvh}.stage,.controls{height:100dvh;min-height:0;overflow-y:auto}.stage{gap:6px;padding:8px max(12px,env(safe-area-inset-left))}.masthead p{display:none}.masthead h1{font-size:1.3rem}.mirror{height:auto;flex:1 0 200px;border-radius:120px 120px 10px 10px/100px 100px 10px 10px}.compare-after{max-height:calc(100dvh - 96px)}.steps{flex:1;overflow-y:auto}.step h2 button{min-height:48px}.action{padding-block:6px;padding-right:max(var(--gutter),env(safe-area-inset-right))}.submit{min-height:44px}}@media(prefers-reduced-motion:reduce){.pipeline-step.active .pipeline-dot{animation:none;background:var(--turmeric)}.toggle-track,.toggle-track:after{transition:none}}.account-bar{display:flex;align-items:center;gap:4px;margin-left:auto}.balance{font-weight:600;white-space:nowrap}.account-out{min-height:44px;min-width:44px;padding:0 8px;border:0;background:none;color:var(--mist);text-decoration:underline}.sign-in{display:grid;justify-items:center;gap:4px}.sign-in-button{width:100%;min-height:44px;display:flex;justify-content:center}