:root{color:#e8eaef;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:radial-gradient(circle at top,#6366f12e,#0000 32%),#0b0d12;font-family:Inter,Segoe UI,system-ui,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}a{color:#a5b4fc}button,input,textarea{font:inherit}#root{min-height:100vh}.app{max-width:1200px;margin:0 auto;padding:2rem 1.25rem 3rem}.header{margin-bottom:2rem}.eyebrow{color:#a5b4fc;letter-spacing:.08em;text-transform:uppercase;margin:0 0 .35rem;font-size:.85rem}.header h1{letter-spacing:-.04em;margin:0;font-size:clamp(2.4rem,5vw,3.5rem)}.subtitle{color:#b8beca;max-width:52rem;margin:.75rem 0 0}.layout{gap:1.25rem;min-width:0;display:grid}.panel{background:#12151eeb;border:1px solid #ffffff14;border-radius:1rem;min-width:0;padding:1.25rem;box-shadow:0 18px 50px #00000040}.panel-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.panel-header h2{margin:0;font-size:1.1rem}.image-stage,.image-selector{width:100%;min-width:0}.image-placeholder,.result-placeholder{color:#9aa3b2;text-align:center;border:1px dashed #ffffff29;border-radius:.85rem;place-items:center;min-height:280px;padding:1rem;display:grid}.image-placeholder p,.result-placeholder p{margin:0}.image-placeholder span{margin-top:.35rem;font-size:.92rem}.selector-toolbar{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;margin-bottom:.65rem;display:flex}.selector-toolbar-secondary{justify-content:space-between;margin-top:-.35rem;margin-bottom:.65rem}.selector-mask-toggle{color:#dbe0ea;font-size:.92rem;font-weight:600}.selector-tool-groups{flex-wrap:wrap;gap:.75rem;margin-right:auto;display:flex}.tool-toggle{gap:.35rem;display:flex}.tool-button.active{background:#6366f138;border:1px solid #818cf8cc}.tool-button.active-remove{background:#f871712e;border:1px solid #f87171d9}.wand-sensitivity{color:#b8beca;align-items:center;gap:.5rem;font-size:.92rem;display:flex}.wand-sensitivity input{width:120px}.wand-sensitivity-value{color:#eef2ff;font-variant-numeric:tabular-nums;min-width:1.75rem}.zoom-controls{color:#b8beca;align-items:center;gap:.4rem;font-size:.92rem;display:flex}.zoom-controls input[type=range]{width:96px}.zoom-button{min-width:2rem;padding-inline:.55rem}.zoom-value{color:#eef2ff;font-variant-numeric:tabular-nums;min-width:2.75rem}.canvas-viewport{scrollbar-width:thin;scrollbar-color:#818cf88c #ffffff0f;background:#0000002e;border:1px solid #ffffff14;border-radius:.85rem;width:100%;min-height:280px;overflow:auto}.canvas-viewport::-webkit-scrollbar{width:10px;height:10px}.canvas-viewport::-webkit-scrollbar-track{background:#ffffff0f;border-radius:999px}.canvas-viewport::-webkit-scrollbar-thumb{background:#818cf88c padding-box padding-box;border:2px solid #0000;border-radius:999px}.canvas-viewport::-webkit-scrollbar-thumb:hover{background:#a5b4fcbf padding-box padding-box}.canvas-zoom-frame{position:relative}.selection-canvas{cursor:crosshair;touch-action:none;will-change:transform;border-radius:.85rem;display:block}.selection-canvas.wand-cursor{cursor:cell}.download-actions{flex-wrap:wrap;gap:.5rem;display:flex}.canvas-hint,.selection-meta{color:#9aa3b2;margin:.75rem 0 0;font-size:.92rem}.field{gap:.45rem;margin-bottom:1rem;display:grid}.field span,.mode-toggle legend{font-weight:600}.field-label-row{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.enhance-button{white-space:nowrap;flex-shrink:0}.complexity-value{color:#c4b5fd;font-variant-numeric:tabular-nums;font-weight:600}.complexity-slider{color:#9aa3b2;align-items:center;gap:.75rem;font-size:.92rem;display:flex}.complexity-slider input[type=range]{flex:1}.field-hint{color:#9aa3b2;margin:.35rem 0 0;font-size:.82rem;font-weight:500}.field small{color:#9aa3b2}.field input,.field textarea{width:100%;color:inherit;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:.75rem;padding:.8rem .9rem}.provider-select{position:relative}.provider-select-trigger{color:#eef2ff;cursor:pointer;text-align:left;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:.75rem;justify-content:space-between;align-items:center;gap:.75rem;width:100%;padding:.8rem .9rem;display:flex}.provider-select-trigger:hover,.provider-select-option:hover{border-color:#818cf88c}.provider-select-chevron{color:#a5b4fc;font-size:.95rem}.provider-select-menu{z-index:20;background:#151924;border:1px solid #818cf873;border-radius:.75rem;margin:0;padding:.35rem;list-style:none;position:absolute;top:calc(100% + .4rem);left:0;right:0;box-shadow:0 16px 40px #00000073}.provider-select-option{color:#e8eaef;cursor:pointer;text-align:left;background:0 0;border:1px solid #0000;border-radius:.55rem;width:100%;padding:.7rem .75rem}.provider-select-option.active{color:#fff;background:#6366f138;border-color:#818cf8cc}.provider-select.is-disabled .provider-select-trigger{opacity:.45;cursor:not-allowed}.model-select-menu{max-height:240px;overflow-y:auto}.model-option-label{display:block}.model-option-id{color:#9aa3b2;margin-top:.15rem;font-size:.82rem;display:block}.provider-select-option.active .model-option-id{color:#dbeafe}.field textarea{resize:vertical;min-height:120px}.api-key-row{gap:.5rem;display:flex}.api-key-row input{flex:1}.mode-toggle{border:0;gap:.75rem;margin:0 0 1rem;padding:0;display:grid}.mode-option{cursor:pointer;background:#ffffff08;border:1px solid #ffffff1a;border-radius:.85rem;align-items:flex-start;gap:.75rem;padding:.9rem 1rem;display:flex}.mode-option.active{background:#6366f11f;border-color:#818cf8cc}.mode-option input{margin-top:.2rem}.mode-option strong{display:block}.mode-option span{color:#9aa3b2;font-size:.92rem}.upload-button,.primary-button,.ghost-button{cursor:pointer;border:0;border-radius:999px;transition:transform .15s,opacity .15s}.upload-button,.primary-button{color:#fff;background:linear-gradient(135deg,#6366f1,#8b5cf6);padding:.75rem 1.1rem;font-weight:600}.ghost-button{color:inherit;background:#ffffff14;padding:.65rem 1rem}.primary-button{width:100%;padding:.95rem 1.1rem}.primary-button:disabled,.upload-button:disabled,.ghost-button:disabled{opacity:.45;cursor:not-allowed;transform:none}.upload-button:hover,.primary-button:hover:not(:disabled),.ghost-button:hover:not(:disabled){transform:translateY(-1px)}.result-viewport-shell{min-width:0}.result-frame{scrollbar-width:thin;scrollbar-color:#818cf88c #ffffff0f;background-color:#0000;background-image:linear-gradient(45deg,#ffffff14 25%,#0000 25%),linear-gradient(-45deg,#ffffff14 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ffffff14 75%),linear-gradient(-45deg,#0000 75%,#ffffff14 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-repeat:repeat,repeat,repeat,repeat;background-size:20px 20px;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;border-radius:.85rem;justify-content:center;align-items:flex-start;min-height:320px;display:flex;overflow:auto}.result-frame::-webkit-scrollbar{width:10px;height:10px}.result-frame::-webkit-scrollbar-track{background:#ffffff0f;border-radius:999px}.result-frame::-webkit-scrollbar-thumb{background:#818cf88c padding-box padding-box;border:2px solid #0000;border-radius:999px}.result-zoom-frame{flex-shrink:0;position:relative}.result-preview-bar{flex-wrap:wrap;align-items:center;gap:.75rem;margin:-.25rem 0 .9rem;display:flex}.result-preview-bar .zoom-controls{margin-left:auto}.overlay-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.7rem;font-weight:600;display:flex;position:relative}.overlay-toggle input{opacity:0;width:1px;height:1px;position:absolute;overflow:hidden}.overlay-toggle .switch{background:#ffffff1f;border:1px solid #ffffff24;border-radius:999px;flex-shrink:0;width:2.6rem;height:1.45rem;position:relative}.overlay-toggle .switch:after{content:"";background:#eef2ff;border-radius:50%;width:1.15rem;height:1.15rem;transition:transform .15s;position:absolute;top:.12rem;left:.12rem}.overlay-toggle input:checked+.switch{background:#6366f1;border-color:#a5b4fce6}.overlay-toggle input:checked+.switch:after{transform:translate(1.15rem)}.overlay-toggle:has(input:disabled){opacity:.45;cursor:not-allowed}.result-preview-note{color:#9aa3b2;flex:12rem;font-size:.85rem}.result-composite{display:block;position:relative}.result-source-layer,.result-design-layer{object-fit:fill;width:100%;height:100%;display:block}.result-composite.has-source .result-design-layer{object-fit:fill;pointer-events:none;z-index:1;position:absolute}.error{color:#fca5a5;margin:1rem 0 0}@media (width>=960px){.layout{grid-template-columns:1.2fr .9fr;align-items:start}.result-panel{grid-column:1/-1}}
