:root{--text:#65605a;--text-h:#1c1917;--bg:#fbfaf7;--surface:#fff;--surface-alt:#f4f1ea;--border:#e4ded5;--border-strong:#cfc5b8;--checker:#8e847621;--accent:#f05a28;--accent-soft:#fff1eb;--danger:#b3261e;--shadow:0 16px 48px #1c191714;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;font:18px/145% var(--sans);letter-spacing:0;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#b8b1a8;--text-h:#fffaf2;--bg:#16130f;--surface:#211d18;--surface-alt:#2b261f;--border:#3d352b;--border-strong:#5a4d3f;--checker:#fffaf214;--accent:#ff7a3d;--accent-soft:#ff7a3d1f;--danger:#ff9b8d;--shadow:0 16px 48px #00000042}}#root{min-height:100svh}body{margin:0}h1{font-family:var(--heading);letter-spacing:0;color:var(--text-h);max-width:760px;margin:0 0 18px;font-size:clamp(38px,7vw,72px);font-weight:800;line-height:.98}p{margin:0}button,input{font:inherit}.app-shell{box-sizing:border-box;width:min(1120px,100%);margin:0 auto;padding:28px}.intro{padding:28px 0 22px}.eyebrow{color:var(--accent);letter-spacing:0;text-transform:uppercase;margin:0 0 10px;font-size:13px;font-weight:700}.intro-copy{width:min(620px,100%);color:var(--text);margin:0;font-size:18px}.workspace{grid-template-columns:360px 1fr;align-items:start;gap:24px;display:grid}.control-panel,.preview-frame,.loading-page{border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow);border-radius:8px}.control-panel{gap:18px;padding:18px;display:grid;position:sticky;top:18px}.upload-zone{border:1.5px dashed var(--border-strong);background:var(--surface-alt);min-height:180px;color:var(--text-h);cursor:pointer;text-align:center;border-radius:8px;place-items:center;padding:14px;display:grid}.upload-zone input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.upload-icon{background:var(--accent);color:#fff;border-radius:999px;place-items:center;width:42px;height:42px;margin-bottom:10px;font-size:30px;line-height:1;display:grid}.upload-title{font-size:18px;font-weight:700;display:block}.upload-subtitle{color:var(--text);margin-top:4px;font-size:13px;display:block}.upload-preview{border-radius:6px;width:100%;display:block;position:relative;overflow:hidden}.upload-preview img{aspect-ratio:4/3;object-fit:cover;width:100%;display:block}.upload-change{color:#fff;background:#1c1917c7;border-radius:999px;padding:7px 10px;font-size:13px;font-weight:700;position:absolute;bottom:10px;right:10px}.style-group{gap:10px;display:grid}.style-option{border:1px solid var(--border);cursor:pointer;border-radius:8px;grid-template-columns:18px 1fr;gap:2px 10px;padding:14px;display:grid}.style-option input{accent-color:var(--accent);grid-row:span 2;align-self:start;margin:3px 0 0}.style-option span{color:var(--text-h);font-weight:700}.style-option small{color:var(--text);font-size:13px;line-height:1.35}.style-option.selected{border-color:var(--accent);background:var(--accent-soft)}.generate-button{background:var(--accent);color:#fff;width:100%;min-height:52px;font:700 16px/1 var(--sans);cursor:pointer;border:0;border-radius:8px}.generate-button:disabled{cursor:not-allowed;opacity:.55}.error-message{color:var(--danger);margin:0;font-size:14px}.comparison{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.source-preview{align-self:stretch}.preview-frame{margin:0;overflow:hidden}.preview-frame span{border-bottom:1px solid var(--border);color:var(--text-h);padding:12px 14px;font-weight:700;display:block}.preview-frame img,.empty-state{aspect-ratio:1;width:100%;display:block}.preview-frame img{object-fit:cover}.empty-state{background:linear-gradient(45deg, var(--checker) 25%, transparent 25%), linear-gradient(-45deg, var(--checker) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--checker) 75%), linear-gradient(-45deg, transparent 75%, var(--checker) 75%);color:var(--text);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;place-items:center;display:grid}.loading-page{text-align:center;place-items:center;min-height:54vh;padding:36px;display:grid}.loading-page h2{color:var(--text-h);margin:18px 0 8px;font-size:28px;line-height:1.2}.loading-page p{max-width:360px}.spinner{border:5px solid var(--border);border-top-color:var(--accent);border-radius:999px;width:54px;height:54px;animation:.9s linear infinite spin}.result-page{gap:18px;display:grid}.result-comparison{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.secondary-button{border:1px solid var(--border-strong);background:var(--surface);min-height:46px;color:var(--text-h);font:700 15px/1 var(--sans);cursor:pointer;border-radius:8px;justify-self:center;padding:0 18px}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=860px){.app-shell{padding:18px}.workspace,.comparison{grid-template-columns:1fr}.control-panel{position:static}}