@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
:root{--paper:#f5f4ef;--ink:#22251f;--muted:#72766b;--line:#dedfd5;--lime:#d2ed8a;--charcoal:#252821;--radius:16px;font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}a{color:inherit;text-underline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,.upload-zone:has(+ input:focus-visible){outline:3px solid #789339;outline-offset:4px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.topbar{max-width:1440px;margin:auto;padding:27px 44px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:11px;align-items:center;text-decoration:none;font-family:'Manrope',sans-serif;font-size:22px;font-weight:800;letter-spacing:-.8px}.brand-mark{font-size:37px;font-weight:400;line-height:1}.brand-light{font-weight:500}.top-links{display:flex;align-items:center;gap:40px;font-size:13px}.top-links>a{text-decoration:none}.top-links>a:hover{text-decoration:underline}.edition,.small-label,.eyebrow,.ideas-heading>span{font-size:10px;font-weight:650;letter-spacing:1.5px}.edition{color:var(--muted)}main{max-width:1440px;margin:auto;padding:0 44px}.intro{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding:45px 0 33px}.eyebrow{display:flex;align-items:center;gap:8px;color:#616858;margin:0 0 14px}.eyebrow span{width:6px;height:6px;border-radius:50%;background:#6a823e}h1{font-family:'Manrope',sans-serif;font-size:clamp(30px,3.1vw,45px);font-weight:650;line-height:1.22;letter-spacing:-2px;margin:0}h1 em{font-style:normal;color:#899477}.intro-note{font-size:13px;line-height:1.65;color:var(--muted);margin:0 0 3px}.workspace{display:grid;grid-template-columns:minmax(320px,.85fr) minmax(410px,1.4fr);gap:20px;align-items:stretch}.controls-panel{background:#fffefa;border:1px solid var(--line);border-radius:var(--radius);padding:27px 28px 21px}fieldset{padding:0;margin:0;border:0;min-width:0}.section-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:21px}h2{font-family:'Manrope',sans-serif;font-size:17px;letter-spacing:-.5px;font-weight:700;margin:0}.small-label{font-size:9px;color:#878d7f}.mode-switch{display:flex;padding:4px;background:#eeefe8;border-radius:9px;margin-bottom:26px;gap:4px}.mode{flex:1;border:0;border-radius:6px;background:transparent;color:#7a7f71;padding:10px 8px;font-size:12px;font-weight:550;transition:background .15s,color .15s}.mode.active{background:#fffefa;color:var(--ink);box-shadow:0 1px 5px #24271910}.prompt-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}label{font-size:12px;font-weight:550}.prompt-header>span{font-size:10px;color:#919487}textarea{width:100%;resize:vertical;min-height:143px;max-height:380px;border:1px solid #dfe1d7;border-radius:9px;background:#fcfcf8;padding:15px;font-size:13px;line-height:1.65;color:var(--ink)}textarea::placeholder{color:#9a9e91}.field-hint{font-size:10px;line-height:1.5;color:#95998b;margin:7px 0 0}.settings-row{display:grid;grid-template-columns:1.18fr 1fr;gap:16px;margin-top:23px}.setting{display:flex;flex-direction:column;gap:9px;min-width:0}.setting>input,.setting>select{height:42px;width:100%;min-width:0;padding:10px 12px;background:#fcfcf8;border:1px solid #dfe1d7;border-radius:7px;color:#444b3a;font-size:12px}.setting>input:disabled{background:#f2f3ec;color:#a2a693}.setting .field-hint{margin:0}.checkbox-label{display:flex;gap:6px;align-items:center;font-size:10px;font-weight:400;color:#848a79;line-height:1.5}.checkbox-label input{margin:0;width:12px;height:12px;accent-color:#5e7432}.recipe{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 0;border-top:1px solid #e9eae2;margin-top:23px;font-size:10px;color:#8c9380}.recipe span:first-child{display:flex;gap:6px;align-items:center;color:#657346}.recipe i{width:5px;height:5px;border-radius:50%;background:#849c54}.recipe b{padding:0 5px;font-weight:400}.generate-button{display:flex;justify-content:space-between;align-items:center;width:100%;height:49px;border:0;background:var(--ink);color:#f3f9e5;border-radius:8px;font-size:13px;font-weight:600;padding:0 17px;transition:background .15s,transform .15s}.generate-button:not(:disabled):hover{background:#414d2f;transform:translateY(-1px)}.button-arrow{font-size:21px;color:var(--lime)}.service-note{margin:13px 0 0;font-size:10px;line-height:1.65;color:#999d91}.service-note a{color:#7a8370}.output-panel{border-radius:var(--radius);background:var(--charcoal);color:#f1f2e9;padding:22px;min-width:0;display:flex;flex-direction:column;border:1px solid #282c23}.output-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 3px 18px}.output-top h2{font-size:13px;letter-spacing:0;font-weight:500}.output-top>span{font-size:8px;letter-spacing:1.5px;color:#a1ad8d;background:#30362a;padding:6px 8px;border:1px solid #404a35;border-radius:4px}.canvas{position:relative;min-height:416px;flex:1;display:flex;align-items:center;justify-content:center;border-radius:8px;border:1px solid #3a4031;background:radial-gradient(ellipse at 50% 44%,#343c2c 0%,#252b21 70%);overflow:hidden}.empty-state{text-align:center;padding:52px 10px}.empty-state>p{font-family:'Manrope',sans-serif;letter-spacing:-.7px;font-size:27px;line-height:1.4;font-weight:500;color:#bac5aa;margin:27px 0 20px}.empty-state>span{font-size:8px;font-weight:500;letter-spacing:2px;color:#6e7d5d}.canvas-symbol{position:relative;margin:auto;width:81px;height:81px;transform:rotate(-10deg)}.canvas-symbol span{position:absolute;width:39px;height:39px;border-radius:3px;background:#c7de8e;opacity:.8}.canvas-symbol span:nth-child(1){top:0;left:0;border-top-left-radius:100%;border-bottom-right-radius:100%}.canvas-symbol span:nth-child(2){top:0;right:0;border-top-right-radius:100%;border-bottom-left-radius:100%;opacity:.57}.canvas-symbol span:nth-child(3){bottom:0;left:0;border-top-right-radius:100%;border-bottom-left-radius:100%;opacity:.57}.canvas-symbol span:nth-child(4){bottom:0;right:0;border-top-left-radius:100%;border-bottom-right-radius:100%}.canvas-corner{position:absolute;width:11px;height:11px;border-color:#6b7958;border-style:solid;opacity:.65;pointer-events:none}.corner-tl{top:13px;left:13px;border-width:1px 0 0 1px}.corner-tr{top:13px;right:13px;border-width:1px 1px 0 0}.corner-bl{bottom:13px;left:13px;border-width:0 0 1px 1px}.corner-br{bottom:13px;right:13px;border-width:0 1px 1px 0}#result-image{display:block;max-width:100%;max-height:720px;width:100%;height:100%;object-fit:contain}.loading-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:#252b21df;backdrop-filter:blur(4px);font-size:12px;color:#c3d2ae}.spinner{height:32px;width:32px;border:2px solid #65734a;border-right-color:var(--lime);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.output-bottom{min-height:33px;padding:17px 2px 0;display:flex;align-items:center;justify-content:space-between;gap:14px}.status-line{display:flex;align-items:center;gap:7px;min-width:0}.status-line>p{font-size:10px;color:#939e85;margin:0;line-height:1.5;overflow-wrap:anywhere}.status-dot{width:5px;height:5px;background:#899e66;border-radius:50%;flex-shrink:0}.status-dot.error{background:#e8b09b}.status-dot.busy{background:var(--lime);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{50%{opacity:.3}}.subtle-button,.result-link{font-size:10px;color:#c5d7a7;white-space:nowrap}.subtle-button{background:none;border:1px solid #526045;padding:5px 8px;border-radius:5px}.result-link{text-decoration:none}.result-link:hover{text-decoration:underline}.error-details{background:#3b322a;border:1px solid #665343;border-radius:7px;padding:13px;margin-top:14px;font-size:11px;line-height:1.65;color:#ead5ba}.error-details p{margin:0 0 8px;overflow-wrap:anywhere}.error-details a{color:#eddfc8}.result-details{border-top:1px solid #414a37;margin-top:14px;padding-top:12px;font-size:10px;line-height:1.6;color:#a5b394}.result-details p{margin:0 0 8px;overflow-wrap:anywhere}.result-details summary{cursor:pointer}.result-details details p{margin-top:8px;white-space:pre-wrap}.ideas{padding:32px 0 29px}.ideas-heading{display:flex;align-items:center;gap:18px;margin-bottom:16px}.ideas-heading h2{font-size:13px;letter-spacing:-.2px}.ideas-heading>span{font-size:8px;color:#9b9f93;letter-spacing:1px}.example-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.example{display:flex;align-items:center;gap:13px;padding:17px 15px;border:1px solid var(--line);border-radius:9px;text-align:left;background:transparent;color:var(--ink);transition:background .15s,border-color .15s}.example:hover{background:#fdfefa;border-color:#b0bd96}.example>span:nth-child(2){flex:1}.example strong{display:block;font-size:11px;font-weight:600;margin-bottom:5px}.example>span>span{display:block;font-size:9px;line-height:1.4;color:#969c8c}.example-number{font-family:'Manrope',sans-serif;font-size:10px;color:#899377;background:#e9edde;border:1px solid #dfe5d4;border-radius:6px;min-width:29px;height:34px;display:flex;align-items:center;justify-content:center}.example-arrow{font-size:16px;color:#8c9a78}footer{border-top:1px solid var(--line);padding:22px 0 25px;display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:9px;color:#a0a497}footer>div{display:flex;align-items:center;gap:15px}footer strong{font-size:11px;font-weight:550;color:#6f7761}footer p{margin:0;text-align:right;line-height:1.7}footer a{color:#869075}.upload-zone{display:flex;flex-direction:column;align-items:center;gap:4px;padding:15px 10px;border:1px dashed #c9d1bd;border-radius:8px;background:#f5f7ef;cursor:pointer;text-align:center}.upload-zone.drag-over{border-color:#6f8a43;background:#ecf3dd}.upload-zone>strong{font-size:11px;font-weight:550}.upload-zone>span:not(.upload-icon){font-size:10px;color:#89957b}.upload-zone small{font-size:9px;font-weight:400;color:#a0a896}.upload-icon{font-size:21px;font-weight:400;color:#7e905e}#references-section{margin-top:21px}.reference-previews{display:flex;gap:8px;margin-top:10px}.reference-card{position:relative;width:calc((100% - 16px)/3);aspect-ratio:1;max-width:100px;border-radius:7px;overflow:hidden;background:#e8edde}.reference-card img{width:100%;height:100%;object-fit:cover}.reference-card>span{position:absolute;left:5px;bottom:5px;background:#222c1ec9;color:white;font-size:9px;border-radius:3px;padding:2px 5px}.reference-card button{position:absolute;top:4px;right:4px;width:23px;height:23px;border:0;border-radius:50%;background:#fffefaeb;color:#3d4930;font-size:16px;line-height:1}.input-message{font-size:10px;color:#8a4b37;line-height:1.5;margin:5px 0 0}.noscript{position:fixed;inset:auto 20px 20px;background:#e6edcd;border:1px solid #92a16a;padding:20px;z-index:10;font-size:14px}
@media(min-width:1500px){main,.topbar{max-width:1370px}.intro{padding-top:53px}.canvas{min-height:440px}}
@media(max-width:1000px){main{padding:0 25px}.topbar{padding:22px 25px}.workspace{grid-template-columns:minmax(290px,.9fr) minmax(340px,1.15fr);gap:15px}.controls-panel{padding:23px 21px 18px}.output-panel{padding:18px}.intro-note{font-size:11px}.example{gap:9px;padding:14px 11px}.example-arrow{display:none}.example>span>span{font-size:8px}.edition{display:none}h1{font-size:34px}.canvas{min-height:416px}}
@media(max-width:760px){main{padding:0 18px}.topbar{padding:19px 18px}.brand{font-size:19px}.brand-mark{font-size:31px}.top-links{font-size:11px}.intro{padding:29px 0 25px;display:block}.intro-note{display:none}h1{font-size:clamp(28px,6.3vw,42px);letter-spacing:-1.4px}.eyebrow{font-size:8px;letter-spacing:1px}.workspace{grid-template-columns:1fr}.controls-panel{padding:23px}.output-panel{padding:17px}.canvas{min-height:340px}.example-grid{grid-template-columns:1fr}.example{padding:13px 14px}.example>span>span{font-size:10px}.example strong{font-size:12px}.example-arrow{display:block}.ideas-heading{justify-content:space-between;gap:8px}.ideas-heading>span{font-size:7px;letter-spacing:.5px}.ideas{padding-top:26px}footer{align-items:flex-start;gap:15px}footer>div{flex-direction:column;align-items:flex-start;gap:6px}footer>div>span{font-size:8px;max-width:145px;line-height:1.5}footer p{font-size:8px}.empty-state>p{font-size:25px}.mode-switch{margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}