:root{font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;color:#242d40;background:#f7f8fa;font-size:14px;font-synthesis:none;--blue:#5269db;--muted:#8c94a3;--line:#edf0f5;--text:#242d40}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.42}button{transition:background .15s,box-shadow .15s,transform .15s}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #a7b5fb;outline-offset:3px}button:not(:disabled):active{transform:translateY(1px)}[hidden]{display:none!important}h1,h2,h3,p{margin:0}a{color:inherit;text-decoration:none}.topbar{height:84px;padding:0 5.2%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8ebf0;background:#fff}.brand{display:flex;gap:12px;align-items:center}.brand-icon{background:var(--blue);width:36px;height:36px;border-radius:11px;color:white;font-size:27px;text-align:center;line-height:32px}.brand strong{font-size:23px;letter-spacing:3px}.brand-en{font-size:10px;letter-spacing:1.8px;color:#9198a7;border-left:1px solid #e1e5ed;padding-left:16px;margin-left:4px}.top-actions{display:flex;align-items:center;gap:25px}.local-badge{font-size:12px;color:#7f899a;display:flex;align-items:center;gap:7px}.local-badge i{width:6px;height:6px;background:#76a78b;border-radius:50%}.button{border:1px solid transparent;border-radius:9px;padding:11px 17px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:500;white-space:nowrap}.subtle{background:#f7f8fb;border-color:#e9ecf3;color:#556174;font-size:12px}.dot{display:inline-block;width:6px;height:6px;background:#daa964;border-radius:50%}.dot.ready{background:#71ad8c}.primary{color:white;background:var(--blue);box-shadow:0 3px 6px #5269db16}.primary:not(:disabled):hover{background:#435bca;box-shadow:0 4px 14px #5269db26}.secondary{color:#59667a;background:white;border-color:#e1e6ee}.secondary:not(:disabled):hover{background:#f7f8fc}.dark{background:#28364c;color:#fff}.text-button{border:0;background:none;color:var(--blue);padding:3px 0;font-size:12px}.text-button:hover{color:#3049b7}.icon-button{border:0;background:#f4f6fa;border-radius:50%;width:30px;height:30px;font-size:24px;color:#8791a2}.muted{color:var(--muted);font-size:11px}main{max-width:1440px;margin:auto;padding:45px 5.2% 0}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.eyebrow{font-size:9px;font-weight:650;color:#8b94ab;letter-spacing:2.2px;margin-bottom:11px}h1{font-size:30px;line-height:1.5;font-weight:650;letter-spacing:.5px}h1 span{color:#65718b}.page-heading p{color:#959cac;font-size:12px;line-height:1.8;margin-top:7px}.workflow{display:flex;align-items:center;gap:7px;font-size:10px;color:#959daa;padding-top:12px}.step-number{display:inline-flex;width:20px;height:20px;justify-content:center;align-items:center;border:1px solid #dce1ec;border-radius:50%;font-size:10px;color:#7c89a5;background:#fff}.step-line{width:22px;height:1px;background:#dce1ec;margin:0 4px}.config-banner{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;background:#f0f3ff;border:1px solid #e6ebff;border-radius:9px;color:#8995b5;font-size:11px;margin-bottom:19px}.config-banner b{color:#6175b1;font-weight:500}.workspace{display:grid;grid-template-columns:minmax(0,1.21fr) minmax(350px,1fr);gap:24px;align-items:start}.panel{background:#fff;border:1px solid #e9edf3;border-radius:14px;box-shadow:0 5px 24px #15274403;overflow:hidden}.panel-title{height:64px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 25px}.panel-title>div{display:flex;align-items:center;gap:9px}.section-index{font-family:monospace;color:#9ca8c3;font-size:11px}h2{font-size:14px;font-weight:600}h3{font-size:12px;font-weight:600}.count-badge{font-size:10px;color:#9ba4b8;background:#f6f7fa;border-radius:4px;padding:4px 7px}.preview-stage{height:445px;position:relative;margin:0 24px;background:#f8f9fc;border:1px dashed #dce2ec;border-radius:10px;display:flex;justify-content:center;align-items:center;overflow:hidden;transition:border .2s,background .2s}.preview-stage.dragover{border-color:var(--blue);background:#eef2ff}.upload-empty{display:flex;align-items:center;flex-direction:column;width:100%;padding:10px}.portrait-illustration{height:145px;width:180px;position:relative;margin-bottom:12px}.mini-card{position:absolute;width:93px;height:122px;border-radius:9px;box-shadow:0 10px 20px #566b9a0e;border:4px solid white}.card-back{background:#dce6f7;left:27px;top:9px;transform:rotate(-13deg)}.card-front{background:#eaeef7;left:55px;top:14px;transform:rotate(8deg)}.card-front svg{width:100%;height:100%;border-radius:5px}.sparkle{position:absolute;right:-18px;top:-17px;font-size:28px;color:#91a2e3}.color-chip{position:absolute;width:21px;height:21px;border:3px solid white;border-radius:50%;box-shadow:0 3px 10px #566b9a20;bottom:5px}.c1{left:52px;background:#fff}.c2{left:80px;background:#72a8e4}.c3{left:108px;background:#df7a7d}.upload-empty h3{font-size:18px;font-weight:550;margin-bottom:10px}.upload-empty p{text-align:center;font-size:11px;color:#949daf;line-height:1.9}.upload-button{margin-top:20px;font-size:12px;min-width:156px}.upload-button span{font-size:18px;font-weight:300}.upload-tip{font-size:9px;color:#adb4c2;margin-top:11px}.local-note{font-size:9px;color:#a0a9ba;margin-top:24px;display:flex;gap:5px;align-items:center}.local-note span{font-size:14px}.preview-tools{display:flex;align-items:center;justify-content:space-between;margin:16px 24px 23px;gap:12px}.segmented{display:flex;background:#f4f6f9;padding:3px;border-radius:7px}.segmented button{border:0;background:none;color:#9ca5b7;padding:6px 13px;font-size:11px;border-radius:5px}.segmented button.active{color:#637395;background:#fff;box-shadow:0 1px 4px #202d5310}.preview-caption{font-size:9px;color:#a0aabb}.image-area{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:16px}.image-frame{position:relative;max-width:100%;max-height:100%;overflow:hidden;border-radius:3px;box-shadow:0 5px 15px #20314710}.image-frame>img,.original-overlay>img{width:100%;height:100%;object-fit:contain;display:block}.original-overlay{position:absolute;inset:0;clip-path:inset(0 50% 0 0)}.checker{background-color:#fff;background-image:linear-gradient(45deg,#edf0f4 25%,transparent 25%),linear-gradient(-45deg,#edf0f4 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#edf0f4 75%),linear-gradient(-45deg,transparent 75%,#edf0f4 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.compare-line{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;box-shadow:0 0 5px #0003;display:flex;align-items:center;justify-content:center}.compare-line span{display:block;border-radius:50%;background:#fff;padding:10px 5px;min-width:31px;text-align:center;color:#5672c8;box-shadow:0 2px 10px #0002;font-size:14px}.image-label{position:absolute;top:11px;color:#fff;font-size:9px;background:#25314f66;padding:4px 7px;border-radius:4px;backdrop-filter:blur(5px)}.image-label.left{left:10px}.image-label.right{right:10px}.compare-controls{display:flex;gap:15px;align-items:center;margin:0 25px 18px;font-size:11px;color:#8290a8}.compare-controls input{flex:1}.processing-overlay{position:absolute;inset:0;background:#f9fafeeb;backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:5;gap:14px}.processing-overlay h3{font-size:15px}.processing-overlay p{font-size:11px;color:#8793ac}.processing-overlay small{font-size:9px;color:#a3adbf}.processing-overlay .button{margin-top:5px;font-size:11px}.spinner{width:30px;height:30px;border:3px solid #dce3fb;border-top-color:#647cdd;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:7px}@keyframes spin{to{transform:rotate(360deg)}}.export-section{border-top:1px solid var(--line);padding:22px 24px 20px}.subheading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.size-presets{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.size-card{padding:10px 7px;display:flex;flex-direction:column;gap:5px;align-items:center;border:1px solid #e9edf3;border-radius:7px;background:#fff;color:#717c91;font-size:11px}.size-card small{font-size:9px;color:#a7aebe}.size-card.active{border-color:#abb9ee;background:#f5f7ff;color:#5870c8}.size-card.active small{color:#8b9ac5}.export-actions{display:flex;gap:9px;margin-top:18px}.export-actions .button{font-size:11px;padding:10px 13px}.export-actions .dark{flex:1}.export-actions select{width:112px;font-size:10px}.fineprint{font-size:9px;line-height:1.8;color:#a4adbd;margin-top:11px}.controls{padding-bottom:0}.category-tabs{display:flex;gap:18px;margin:0 24px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:thin}.category-tabs button{border:0;border-bottom:2px solid transparent;background:none;padding:0 0 12px;color:#a1a9b7;white-space:nowrap;font-size:11px}.category-tabs button.active{color:var(--blue);border-bottom-color:var(--blue)}.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:19px 24px 0}.preset-card{padding:6px 6px 10px;border:1px solid #e8ecf2;border-radius:8px;background:white;text-align:left;position:relative;min-width:0}.preset-card:hover{border-color:#b6c3ea}.preset-card.active{border:1.5px solid #7f97e5;background:#f8faff;padding:5.5px 5.5px 9.5px}.swatch{height:63px;display:flex;align-items:center;justify-content:center;border-radius:4px;border:1px solid #00000005;margin-bottom:9px;position:relative;overflow:hidden}.swatch-figure{height:50px;width:42px;opacity:.8;align-self:flex-end}.swatch-figure circle,.swatch-figure path{fill:#fff9}.preset-card[data-id=white] .swatch-figure circle,.preset-card[data-id=white] .swatch-figure path{fill:#dce3ef}.preset-name{font-size:11px;color:#596881;display:block;margin-left:4px}.preset-tag{font-size:8px;color:#a1aabd;display:block;margin:4px 0 0 4px}.preset-check{position:absolute;right:10px;top:10px;background:#fff;color:var(--blue);border-radius:50%;width:17px;height:17px;display:grid;place-items:center;font-size:10px;box-shadow:0 1px 5px #172a5822}.selected-description{display:flex;gap:6px;align-items:center;font-size:9px;color:#97a2b7;margin:15px 25px 20px}.tiny-check{color:#8ba1d5;font-size:11px}.custom-color{display:flex;align-items:center;gap:12px;margin:15px 24px 0;font-size:11px;color:#7b89a2}.custom-color input[type=color]{width:32px;height:30px;border:1px solid #e1e5ed;padding:2px;background:#fff;border-radius:5px}.custom-color input[type=text]{width:95px;padding:7px;font-size:11px}.prompt-section{padding:20px 24px 0;border-top:1px solid var(--line)}.optional{color:#a7afbd;background:#f5f6f9;padding:2px 6px;border-radius:4px;font-size:9px}.field-description{color:#a1aaba;font-size:10px;margin-bottom:12px}.textarea-wrap{position:relative}textarea{width:100%;resize:vertical;min-height:118px;max-height:300px;border:1px solid #e6eaf1;border-radius:8px;background:#fafbfd;padding:12px 12px 27px;font-size:11px;line-height:1.8;outline:none;color:#5f6c83}textarea::placeholder{color:#b2bbcb}textarea:focus,input:focus,select:focus{border-color:#9eaded;outline:2px solid #5269db0c}#promptCount{position:absolute;right:11px;bottom:11px;font-size:8px;color:#b0b8c7;pointer-events:none}.prompt-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}.prompt-chips button{border:1px solid #eef0f5;background:#fff;border-radius:5px;color:#8d98ac;font-size:9px;padding:5px 7px}.prompt-chips button:hover{background:#f4f6fd}.prompt-actions{display:flex;align-items:center;justify-content:space-between;margin-top:11px}.prompt-actions button{font-size:10px}.preserve-card{display:flex;align-items:center;gap:10px;padding:13px;background:#f5f8fd;border:1px solid #edf1f8;border-radius:8px;margin:20px 24px 16px}.shield-icon{font-size:26px;color:#8aa3d1}.preserve-card b{font-size:10px;font-weight:500;color:#788eae}.preserve-card p{font-size:9px;color:#a1aec3;margin-top:4px;line-height:1.6}.lock-icon{margin-left:auto;font-size:11px;color:#8ca4d4}.advanced{margin:0 24px;font-size:10px;color:#95a1b7}.advanced summary{display:flex;justify-content:space-between;cursor:pointer;list-style:none;padding:4px 0}.advanced summary::-webkit-details-marker{display:none}.advanced-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:15px 0}.advanced-fields label{display:flex;flex-direction:column;gap:7px}.advanced-fields select{width:100%;font-size:10px}.advanced pre{white-space:pre-wrap;line-height:1.8;font:10px/1.8 inherit;max-height:180px;overflow:auto;background:#f7f9fc;border-radius:6px;padding:10px;color:#8b98ad}.advanced .text-button{font-size:10px}.generate-footer{padding:20px 24px 21px;display:flex;align-items:center;flex-direction:column;gap:10px}.generate-button{width:100%;height:44px;font-size:12px}.generate-button span:last-child{margin-left:auto}.generate-button span:first-child{margin-right:auto;font-size:17px}.generate-footer>span{font-size:9px;color:#a1adbf}.page-footer{display:flex;justify-content:space-between;padding:27px 2px;font-size:10px;color:#a2aab9}.footer-separator{margin:0 9px;color:#c5ccd7}input:not([type=range]):not([type=color]),select{border:1px solid #e2e7f0;border-radius:7px;background:#fff;color:#68778e;padding:10px;font-size:12px}input[type=range]{accent-color:var(--blue);min-width:0;height:16px}.crop-controls{display:flex;gap:20px;padding:17px 0 0}.crop-preview{height:145px;min-width:120px;border:1px solid #eef0f5;display:flex;justify-content:center;align-items:center;position:relative;border-radius:6px;overflow:hidden}.crop-preview canvas{max-height:130px;max-width:120px;width:auto;height:auto}.crop-preview span{position:absolute;bottom:4px;background:#35445d80;color:white;font-size:8px;padding:2px 5px;border-radius:3px}.crop-sliders{flex:1;display:flex;flex-direction:column;justify-content:center;gap:8px}.crop-sliders label{display:flex;align-items:center;gap:8px;color:#8c99b0;font-size:10px;white-space:nowrap}.crop-sliders input{flex:1;width:100%}.crop-sliders button{font-size:9px;text-align:right}.result-message{margin:0 24px 15px;border:1px solid #e1e9fb;background:#f5f8ff;color:#788fae;padding:10px;border-radius:6px;font-size:11px;line-height:1.7}.result-message.error{border-color:#f4d7d3;background:#fff7f5;color:#b26c60}.saved-prompts{display:flex;gap:6px;flex-wrap:wrap}.saved-prompts:not(:empty){margin-top:10px}.saved-prompt{display:flex;align-items:center;background:#f4f6fc;border-radius:5px;overflow:hidden}.saved-prompt button{border:0;background:none;color:#8796b5;padding:5px 8px;font-size:9px;max-width:150px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.saved-prompt .remove{padding-left:0;color:#a5aec0}.history-section{margin-top:25px}.history-section .subheading{margin-bottom:15px}.history-grid{display:flex;gap:12px;overflow-x:auto;padding:2px}.history-card{border:1px solid #e2e8f2;border-radius:8px;padding:7px;background:white;min-width:110px;max-width:130px;text-align:left}.history-card img{width:110px;height:110px;object-fit:contain;background:#f5f7fa;border-radius:4px}.history-card span{display:block;font-size:10px;color:#8290a6;padding:8px 3px 3px}.history-card.active{border-color:#8ca3e4}dialog{border:1px solid #e4e9f3;border-radius:16px;width:min(480px,calc(100% - 32px));padding:28px;box-shadow:0 20px 80px #14204725;color:var(--text);max-height:90vh}dialog::backdrop{background:#1f2a4555;backdrop-filter:blur(4px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between}.dialog-heading h2{font-size:20px}.dialog-heading .eyebrow{font-size:8px}.dialog-description{font-size:11px;color:#939fb5;line-height:1.9;margin:15px 0 22px}.form-label{display:block;font-size:11px;color:#78869d;margin:17px 0 8px}.form-label:first-of-type{margin-top:0}dialog input,dialog select{width:100%}.field-help{font-size:10px;color:#a5aec0;line-height:1.7;margin-top:6px}.key-status{color:#829ec1;font-size:9px;margin-left:8px}.connection-advanced{font-size:11px;margin-top:22px;color:#929fb4}.connection-advanced summary{cursor:pointer}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}.dialog-actions .button{font-size:11px;padding:11px 13px}.connection-message{padding:12px;font-size:11px;line-height:1.8;background:#f3f6fd;color:#7990b4;border-radius:7px;margin-top:17px}.toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);background:#28354ded;color:#fff;box-shadow:0 5px 30px #18233920;border-radius:10px;padding:13px 23px;font-size:12px;max-width:90%;z-index:100}
@media(min-width:1440px){main{padding-left:56px;padding-right:56px}.preview-stage{height:480px}.swatch{height:74px}.preset-grid{gap:13px}.prompt-section{padding-top:22px}.preserve-card{margin-top:24px}.generate-footer{padding-top:25px}.category-tabs{gap:23px}}
@media(max-width:1080px){.workflow{display:none}.workspace{gap:17px;grid-template-columns:minmax(0,1.1fr) minmax(340px,1fr)}main{padding:30px 3% 0}.topbar{padding:0 3%}.panel-title{padding:0 18px}.preview-stage{margin:0 16px;height:426px}.preview-tools{margin-left:16px;margin-right:16px}.preview-caption{display:none}.category-tabs{gap:13px;margin:0 18px}.preset-grid{padding-left:18px;padding-right:18px;gap:8px}.prompt-section,.generate-footer{padding-left:18px;padding-right:18px}.preserve-card{margin-left:18px;margin-right:18px}.advanced{margin-left:18px;margin-right:18px}.export-section{padding-left:16px;padding-right:16px}.export-actions{gap:6px}.export-actions select{width:97px}.export-actions .button{padding:9px}.swatch{height:59px}}
@media(max-width:760px){.topbar{height:68px;padding:0 20px}.brand-en{display:none}.brand strong{font-size:20px}.local-badge{display:none}.top-actions{gap:0}main{padding:26px 17px 0}.page-heading{margin-bottom:20px}.eyebrow{font-size:8px;letter-spacing:1.5px}h1{font-size:23px}.page-heading p{font-size:10px}.workspace{display:flex;flex-direction:column;gap:18px}.panel{width:100%}.editor{order:0}.controls{order:1}.preview-stage{height:378px}.panel-title{height:57px}.preview-caption{display:block;font-size:8px}.size-presets{grid-template-columns:repeat(3,1fr)}.export-actions select{width:120px}.export-actions .button{padding:11px 14px}.config-banner{font-size:10px;line-height:1.8;gap:13px}.config-banner>span{flex:1}.config-banner .text-button{white-space:nowrap;font-size:10px}.swatch{height:85px}.preset-grid{gap:12px}.category-tabs{justify-content:space-between;gap:12px}.category-tabs button{font-size:11px}.prompt-section{padding-top:20px}.preserve-card{margin-top:20px}.page-footer{line-height:1.8;font-size:8px;gap:12px}.page-footer>span:last-child{text-align:right}.generate-button{height:48px}.generate-footer{position:sticky;bottom:0;background:#fffc;backdrop-filter:blur(12px)}.history-card img{width:90px;height:95px}.history-card{min-width:103px}.history-section .muted{font-size:9px}}
.mode-card{margin:0 24px 20px;padding:13px;background:#f3f7ff;border:1px solid #e5ecfc;border-radius:8px;display:grid;grid-template-columns:62px 1fr;align-items:center;gap:8px}.mode-card label{font-size:11px;color:#7184a4}.mode-card select{font-size:11px;padding:8px;width:100%}.mode-card p{grid-column:1/-1;font-size:10px;color:#8d9bb2;line-height:1.8}textarea:disabled{background:#f4f5f8;color:#a8afbd}#promptModeNote{line-height:1.8}
@media(prefers-reduced-motion:reduce){:root:not([data-motion=soft]) *{animation-duration:.001ms!important;transition:none!important}}

/* Compact workspace: the photo and its controls take priority. */
:root{--blue:#536ada;--muted:#8892a5;background:#f5f6f9;color:#293349}
.topbar{height:72px;padding:0 max(28px,calc((100vw - 1244px)/2));border-color:#e8ebf2}
.brand{gap:11px}.brand strong{font-size:21px;letter-spacing:2px}.brand-en{font-size:12px;letter-spacing:1px;color:#8b96aa;padding-left:15px}
.brand-icon{width:33px;height:33px;border-radius:10px;font-size:24px;line-height:30px}
.button.subtle{font-size:12px;padding:9px 14px;background:white;border-color:#e4e8f0}
main{max-width:1300px;padding:28px 28px 36px}
.workspace{grid-template-columns:minmax(0,1.4fr) minmax(375px,1fr);gap:24px}
.panel{border-color:#e5e9f1;border-radius:16px;box-shadow:0 6px 24px #24345303}
.panel-title{height:60px;padding:0 24px}.panel-title h2{font-size:15px;font-weight:600}
.preview-stage{height:420px;margin:0 24px;background:#f8f9fc;border-color:#dce3ef;border-radius:12px}
.upload-empty .portrait-illustration{margin-bottom:13px}.upload-empty p{font-size:12px;color:#939db1}
.upload-button{margin-top:17px;min-width:146px;height:42px;font-size:13px;border-radius:9px}.upload-tip{font-size:10px;margin-top:14px}
.preview-tools{margin:15px 24px 20px}.preview-caption{display:block;font-size:10px}.segmented button{font-size:12px;padding:6px 15px}
.export-section{padding:20px 24px}.subheading h3{font-size:12px}.size-card{padding:10px 7px;font-size:12px}.size-card small{font-size:10px}
.export-actions{margin-top:17px}.export-actions .button{font-size:12px;padding:11px 14px}.export-actions select{font-size:11px;width:119px}.fineprint{font-size:10px;color:#9ca5b5}
.mode-card{margin:0 24px 20px;padding:0;border:0;background:transparent;grid-template-columns:55px 1fr;gap:8px}.mode-card label{font-size:12px;color:#78859b}.mode-card select{font-size:12px;background:#f9fafc;padding:9px 11px;border-color:#e5e9f2;border-radius:8px}.mode-card p{font-size:10px;color:#97a2b6;line-height:1.5;margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.category-tabs{margin:0 24px;gap:17px}.category-tabs button{font-size:12px;padding-bottom:12px}.preset-grid{padding:18px 24px 22px;gap:11px}
.preset-card{padding:7px 7px 12px;border-radius:10px}.preset-card.active{padding:6.5px 6.5px 11.5px;background:#f7f9ff}.swatch{height:69px;border-radius:6px;margin-bottom:10px}.preset-name{font-size:12px;margin-left:3px}.preset-check{top:12px;right:12px}
.text-mode-button{display:flex;justify-content:space-between;align-items:center;width:calc(100% - 48px);margin:0 24px 3px;border:1px solid #e9edf5;border-radius:8px;background:#fafbfe;color:#7486af;padding:12px 13px;font-size:12px;text-align:left}.text-mode-button:hover{background:#f1f5ff;border-color:#d7e1f9}
.custom-color{margin-top:0;margin-bottom:18px}.prompt-section{padding:21px 24px 0}.prompt-section .subheading{margin-bottom:12px}.prompt-section h3{font-size:13px}.textarea-wrap textarea{font-size:12px;min-height:110px;padding:12px 12px 25px;background:#fafbfd}.prompt-chips{gap:7px}.prompt-chips button{font-size:10px;padding:6px 8px}.prompt-actions button{font-size:11px}.advanced{margin:20px 24px 0}.advanced summary{font-size:11px}.advanced-fields label{font-size:11px}.advanced-fields select{font-size:11px}
.generate-footer{padding:21px 24px 20px;gap:9px}.generate-button{height:44px;font-size:13px;border-radius:9px}.generate-footer>span{font-size:10px;min-height:14px}
.compare-controls{font-size:11px}.result-message{font-size:11px;padding:9px 12px;background:#f7f9fd;border-color:#e8edf6;color:#7b8caa}
.processing-overlay h3{font-size:15px}.processing-overlay p{font-size:12px}.processing-overlay small{font-size:10px}.processing-overlay .button{font-size:12px}
dialog{width:min(470px,calc(100% - 32px));padding:28px;border-radius:16px;max-height:90vh}.dialog-heading{margin-bottom:25px}.dialog-heading h2{font-size:19px}.form-label{font-size:12px;margin:18px 0 8px;color:#758198}.field-help{font-size:10px;line-height:1.7;margin-top:9px}dialog input,dialog select{font-size:12px!important;padding:11px 12px!important;background:#fcfdff!important;border-color:#e1e7f2!important;min-width:0}dialog .key-status{font-size:10px;color:#91a0b9}.model-label-row{display:flex;justify-content:space-between;align-items:center;margin-top:18px;margin-bottom:8px}.model-label-row .form-label{margin:0}.model-label-row .text-button{font-size:11px}.model-label-row button:disabled{opacity:.5}#modelName{margin-top:9px}#modelStatus{min-height:17px}.connection-advanced{border-top:1px solid #edf0f5;margin-top:19px;padding-top:16px;font-size:11px}.connection-message{font-size:11px;padding:10px 12px;margin-top:16px}.dialog-actions{margin-top:23px;gap:10px}.dialog-actions .button{font-size:12px;padding:10px 18px;min-width:85px}.history-section{margin-top:24px}
@media(max-width:1080px){main{padding:24px 22px 32px}.topbar{padding:0 24px}.workspace{gap:18px;grid-template-columns:minmax(0,1.1fr) minmax(350px,1fr)}.preview-stage{height:393px}.category-tabs{gap:13px}.category-tabs button{font-size:11px}.preset-grid{gap:9px}.swatch{height:61px}.export-actions select{width:102px}.export-actions .button{padding:10px;font-size:11px}}
@media(max-width:760px){.topbar{height:64px;padding:0 19px}.brand-en{display:block;font-size:11px}.brand strong{font-size:19px}.brand-icon{width:30px;height:30px;font-size:22px;line-height:27px}main{padding:18px 15px 28px}.workspace{display:flex;gap:17px}.panel-title{height:53px;padding:0 19px}.preview-stage{height:340px;margin:0 18px}.preview-tools{margin:13px 18px 17px}.preview-caption{font-size:9px}.export-section{padding:18px}.size-card{font-size:11px}.size-card small{font-size:9px}.export-actions .button{font-size:11px;padding:11px}.export-actions select{width:113px}.mode-card{margin:0 19px 18px}.category-tabs{margin:0 19px;gap:12px}.category-tabs button{font-size:11px}.preset-grid{padding:18px 19px;gap:10px}.swatch{height:72px}.prompt-section{padding:19px 19px 0}.advanced{margin:17px 19px 0}.text-mode-button{margin:0 19px 0;width:calc(100% - 38px)}.generate-footer{padding:20px 19px}.fineprint{font-size:9px}.custom-color{margin-left:19px;margin-right:19px}dialog{padding:22px}.dialog-heading{margin-bottom:21px}}

/* Keep the main workflow in one desktop view, with a shared export row. */
.topbar{height:60px}
main{padding-top:18px;padding-bottom:20px}
.workspace{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px;align-items:stretch}
.panel-title{height:48px;flex-shrink:0;padding:0 20px}
.editor{display:flex;flex-direction:column;min-width:0}
.preview-stage{height:300px;min-height:240px;flex:1;margin:0 20px}
/* The image must not contribute its intrinsic size to the flexible grid row. */
.image-area{position:absolute;inset:0;min-width:0;min-height:0}
.upload-empty .portrait-illustration{transform:scale(.78);height:120px;margin-bottom:4px;transform-origin:center center}
.upload-button{margin-top:12px;height:38px}
.upload-tip{margin-top:10px}
.preview-tools{flex-shrink:0;margin:10px 20px 14px}
.compare-controls{margin:0 20px 10px}
.result-message{margin:0 20px 12px;padding:6px 10px}
.controls{display:flex;flex-direction:column;min-width:0}
.mode-card{margin:0 20px 12px;gap:5px 10px}
.mode-card select{padding:7px 10px}
.category-tabs{margin:0 20px;gap:0;justify-content:space-between;flex-shrink:0}
.category-tabs button{padding-bottom:9px;font-size:12px}
.preset-grid{padding:12px 20px 14px;gap:9px}
.preset-card{padding:6px 6px 8px}
.preset-card.active{padding:5.5px 5.5px 7.5px}
.swatch{height:52px;margin-bottom:7px}
.swatch-figure{height:43px;width:36px}
.text-mode-button{margin:0 20px;width:calc(100% - 40px);padding:10px 12px}
.generate-footer{margin-top:auto;padding:14px 20px;gap:6px}
.generate-button{height:40px}
.prompt-section{padding:12px 20px 0}
.prompt-section .subheading{margin-bottom:8px}
.textarea-wrap textarea{height:76px;min-height:76px;padding:8px 10px 22px;line-height:1.6}
.prompt-chips{margin-top:6px;gap:6px}
.prompt-chips button{padding:4px 7px}
.prompt-actions{margin-top:6px}
.advanced{margin:10px 20px 0}
.custom-color{margin:0 20px 12px}
.export-section{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 24px;padding:16px 20px}
.export-specs{min-width:0}
.export-section .subheading{margin-bottom:10px}
.size-presets{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}
.size-card{padding:8px 5px;gap:4px}
.size-card small{font-size:9px;white-space:nowrap}
.export-download{display:flex;flex-direction:column;justify-content:flex-end;border-left:1px solid var(--line);padding-left:24px}
.export-actions{margin:0;gap:8px}
.export-actions select{width:104px}
.export-actions .button{padding:10px 12px}
.export-download .fineprint{margin-top:9px;text-align:right}
.crop-controls{border-top:1px solid var(--line);padding:10px 0 0;margin:0 20px 12px;gap:18px;flex-shrink:0}
.crop-preview{height:72px;min-width:64px;width:64px;flex-shrink:0}
.crop-preview canvas{max-height:66px;max-width:60px}
.crop-preview span{font-size:7px;bottom:2px}
.crop-sliders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:5px 18px}
.crop-sliders label{font-size:11px;flex-direction:column;align-items:stretch;gap:5px}
.crop-sliders button{font-size:10px;grid-column:1/-1;justify-self:end}
.history-section{margin-top:16px}
.history-grid{gap:9px}
.history-card{min-width:85px;padding:5px}
.history-card img{width:75px;height:64px}
.history-card span{padding:5px 2px 2px}
@media(min-width:761px) and (max-height:800px){
  .topbar{height:54px}
  main{padding-top:14px;padding-bottom:10px}
  .preview-stage{height:260px;min-height:220px}
  .controls:has(#promptSection:not([hidden])) .swatch{height:38px}
  .controls:has(#promptSection:not([hidden])) .swatch-figure{height:34px}
  .controls:has(#promptSection:not([hidden])) .preset-grid{padding-top:10px;padding-bottom:10px;gap:7px}
  .controls:has(#promptSection:not([hidden])) .preset-card{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:5px;padding:6px}
  .controls:has(#promptSection:not([hidden])) .preset-card.active{padding:5.5px}
  .controls:has(#promptSection:not([hidden])) .swatch{height:30px;margin:0}
  .controls:has(#promptSection:not([hidden])) .swatch-figure{height:26px;width:22px}
  .controls:has(#promptSection:not([hidden])) .preset-check{top:3px;right:3px;width:13px;height:13px;font-size:8px}
  .prompt-section{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 8px}
  .prompt-section>.subheading,.prompt-section>.textarea-wrap,.saved-prompts{grid-column:1/-1}
  .prompt-actions{gap:12px}
  .generate-footer{padding-top:10px;padding-bottom:10px;gap:4px}
}
@media(min-width:761px) and (max-height:700px){
  .topbar{height:48px}
  main{padding-top:8px;padding-bottom:6px}
  .panel-title{height:44px}
  .preview-stage{min-height:170px}
  .mode-card{margin-bottom:8px}
  .controls:has(#promptSection:not([hidden])) .preset-grid{padding-top:8px;padding-bottom:8px;gap:6px}
  .prompt-section{padding-top:8px}
  .prompt-section .subheading{margin-bottom:6px}
  .textarea-wrap textarea{height:64px;min-height:64px}
  .advanced{margin-top:6px}
  .generate-footer{padding-top:8px;padding-bottom:8px;gap:3px}
  .generate-button{height:36px}
  .export-section{padding-top:12px;padding-bottom:12px}
}
@media(min-width:761px) and (max-width:1100px){
  main{padding-left:18px;padding-right:18px}
  .workspace{gap:14px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .category-tabs button{font-size:11px}
  .export-section{grid-template-columns:minmax(0,1fr) 280px;gap:12px 16px}
  .export-download{padding-left:16px}
  .export-actions{flex-wrap:wrap;gap:6px}
  .export-actions select{width:93px}
  .export-actions .button{padding:9px 8px;font-size:11px}
  .export-actions #printButton{flex:1}
  .size-presets{grid-template-columns:repeat(3,minmax(0,1fr))}
  .size-card{padding:6px 4px}
  .crop-sliders{gap:12px}
}
@media(max-width:760px){
  .topbar{height:60px}
  main{padding:14px 14px 24px}
  .workspace{gap:14px}
  .preview-stage{flex:none;height:260px;min-height:0;margin:0 18px}
  .panel-title{padding:0 18px}
  .preview-tools{margin:10px 18px 14px}
  .export-section{order:2;display:flex;flex-direction:column;gap:14px;padding:16px 18px}
  .size-presets{grid-template-columns:repeat(3,minmax(0,1fr))}
  .export-download{border:0;padding:0}
  .export-actions{gap:6px}
  .export-actions select{width:99px}
  .export-actions .button{padding:10px 8px}
  .export-download .fineprint{text-align:left}
  .crop-sliders{display:flex;gap:7px}
  .crop-sliders label{flex-direction:row;align-items:center}
  .generate-footer{position:static}
}