:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",Arial,sans-serif;color:#161616;background:#f6f5fa}*{box-sizing:border-box}body{margin:0;min-width:1100px;background:radial-gradient(circle at 16% 12%,#fafaf8 0,#f6f5fa 48%,#f9eff2 100%);min-height:100vh}.app-shell{padding:68px 48px 62px;max-width:1550px;margin:0 auto}.hero{padding-left:0}.eyebrow{font-size:16px;line-height:24px;margin-bottom:8px}.hero h1{font-size:36px;line-height:48px;margin:0;font-weight:760;letter-spacing:-1px}.hero p{margin:7px 0 39px;color:#a7a6aa;font-size:17px}.tabs{display:flex;gap:64px;height:50px;align-items:flex-start}.tab{border:0;background:none;font-size:20px;padding:0 14px 14px;cursor:pointer}.tab.active{color:#ef4c52;border-bottom:4px solid #f34c53}.workspace{display:grid;grid-template-columns:1fr 1fr 1.22fr;gap:20px}.panel{height:526px;border-radius:20px;background:rgba(255,255,255,.96);padding:20px;position:relative;box-shadow:0 2px 10px rgba(55,44,90,.025)}h2{font-size:20px;margin:0 0 20px;font-weight:740}.ai-panel h2,.config-panel h2,.preview-panel h2{margin-bottom:20px}.prompt-box{height:139px;border:1px solid #e7e7ea;border-radius:12px;position:relative;background:#fff}.prompt-box textarea,.textarea-wrap textarea{border:0;outline:0;resize:none;background:transparent;width:100%;height:100%;padding:12px 16px;font:16px inherit;color:#555}.prompt-box textarea::placeholder,input::placeholder,textarea::placeholder{color:#b7b7bb}.circle-btn{width:38px;height:38px;border:0;border-radius:50%;background:#dedbff;color:white;font-size:28px;line-height:38px;cursor:pointer;display:flex;align-items:center;justify-content:center;position:absolute;right:14px;bottom:11px}.circle-btn.ready{background:#9e91f7}.circle-btn:hover{filter:brightness(.96)}label{display:block;font-size:17px;margin:0 0 25px}.input-wrap{height:40px;border:1px solid #e7e7ea;background:#fff;border-radius:11px;display:flex;align-items:center;margin-top:8px;padding:0 13px}.input-wrap input{border:0;outline:0;flex:1;font:16px inherit;min-width:0}.input-wrap span{font-size:14px;color:#acabb1}.textarea-wrap{height:114px;align-items:flex-start}.textarea-wrap textarea{padding:12px 16px}.config-send{bottom:20px}.preview-panel{padding:20px 24px}.preview-empty{height:367px;border-radius:14px;background:#f0f0f0;display:flex;align-items:center;justify-content:center;color:#a6a4aa;font-size:20px;overflow:hidden}.preview-empty img{width:100%;height:100%;object-fit:cover}.actions{display:flex;justify-content:flex-end;gap:12px;margin-top:39px}.actions button{height:57px;border-radius:10px;padding:0 64px;font-size:20px;font-weight:650;cursor:pointer}.secondary{background:white;border:1px solid #d8d7dc}.primary{border:0;background:#ff213d;color:#fff;box-shadow:0 5px 12px rgba(255,33,61,.12)}.primary:hover{background:#ef1833}.ai-message{background:#fafafa;border-radius:11px;padding:12px 16px;color:#555;font-size:16px;line-height:1.5;min-height:74px;margin-bottom:16px}.ai-tools{display:flex;gap:15px;color:#a5a5aa;font-size:16px;margin:-6px 0 25px 5px}.ai-tools button{border:0;background:none;color:inherit;cursor:pointer;padding:0}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(20px);background:#222;color:#fff;padding:10px 18px;border-radius:8px;opacity:0;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.skill-strip{display:flex;align-items:center;gap:8px;margin:-8px 0 20px;font-size:12px;color:#9997a2}.skill-badge{padding:4px 8px;border-radius:999px;background:#f0edff;color:#7567d8;font-weight:650}.generation-meta{font-size:12px;color:#9997a2;text-align:center;margin-top:12px;min-height:16px}

.api-row{display:flex;align-items:center;gap:8px;margin:-10px 0 20px}.api-row input{height:32px;flex:1;min-width:0;border:1px solid #e7e7ea;border-radius:9px;padding:0 10px;font:12px inherit;outline:0}.api-row span{font-size:11px;color:#aaa8b0;white-space:nowrap}
.hidden{display:none!important}.coupon-workspace{grid-template-columns:1fr 1fr 1.22fr}.coupon-config{overflow-y:auto}.coupon-config::-webkit-scrollbar{width:4px}.coupon-config::-webkit-scrollbar-thumb{background:#bbb;border-radius:4px}.palette-group{margin:4px 0 23px}.palette-label{font-size:17px;margin-bottom:10px}.swatches{display:flex;gap:10px}.swatch{width:56px;height:32px;border-radius:7px;border:1px solid var(--swatch);background:var(--swatch);color:white;font-weight:700;font-size:17px;cursor:pointer}.swatch.selected{box-shadow:0 0 0 1px #fff inset}.layout-choice{display:flex;gap:34px;font-size:16px;margin:2px 0 20px}.layout-choice label{margin:0;font-size:16px;cursor:pointer}.layout-choice input{accent-color:#f05b66;margin-right:6px}.coupon-preview-panel{padding:20px 24px}.coupon-preview-area{height:367px;display:flex;align-items:center;justify-content:center}.coupon-card{width:450px;height:84px;border-radius:13px;background:#fff1f2;position:relative;display:flex;align-items:center;padding:0 16px 0 20px;gap:18px;transition:.2s}.coupon-card.double{width:300px;height:116px;display:grid;grid-template-columns:115px 1fr;grid-template-rows:1fr 38px;gap:0 15px;padding:15px 18px}.coupon-badge{position:absolute;left:10px;top:-1px;background:#ff4d57;color:#fff;border-radius:0 0 8px 8px;padding:3px 11px;font-size:12px}.coupon-benefit{display:flex;align-items:baseline;justify-content:center;color:#ff4d57;min-width:102px;margin-top:8px}.coupon-benefit b{font-size:48px;line-height:1;font-weight:500}.coupon-benefit span{font-size:18px;font-weight:650;margin-left:3px}.coupon-copy{display:flex;flex-direction:column;min-width:0}.coupon-copy strong{font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.coupon-copy small{font-size:14px;color:#999;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.coupon-card button{border:0;border-radius:18px;background:#ff4d57;color:#fff;font-size:16px;padding:8px 20px;white-space:nowrap;cursor:pointer}.coupon-card.double .coupon-benefit{transform:translateY(8px)}.coupon-card.double .coupon-copy{align-self:center}.coupon-card.double button{grid-column:2;grid-row:2;padding:7px 18px;font-size:14px}.export-size{font-size:14px;color:#aaa8b0;text-align:right;margin-top:0}
.coupon-card.double .coupon-benefit b{font-size:54px}.coupon-card.double .coupon-benefit span{font-size:20px}.coupon-card.double button{height:28px;padding-top:0;padding-bottom:0}.coupon-card.double button{transform:translateY(-6px)}
.coupon-card:not(.double) button{transform:translateX(12px)}
.coupon-card:not(.double) button{transform:translateX(22px)}
.coupon-benefit b{font-family:JDZheng,Arial,Microsoft YaHei,sans-serif;font-weight:400}
.coupon-badge,.coupon-copy strong{font-family:PingFangCustom,Arial,Microsoft YaHei,sans-serif;font-weight:700}
.coupon-card.double .coupon-copy strong{transform:translateY(6px)}
.coupon-card:not(.double) .coupon-copy strong{transform:translateY(6px)}
.coupon-card.double .coupon-benefit b{font-size:60px}.coupon-card.double .coupon-benefit span{font-size:22px}
.coupon-card.double .coupon-copy{transform:translateY(-8px)}
.coupon-card.double .coupon-copy strong{transform:none}
.coupon-card.double button{transform:translateY(-12px)}
.coupon-card.double .coupon-copy strong{transform:translateY(6px)}

.coupon-copy strong{font-family:PingFangTitleBold,Arial,Microsoft YaHei,sans-serif;font-weight:700}

.head-workspace{grid-template-columns:1fr 1.22fr 1fr}.head-config{padding:20px}.head-config label{margin-bottom:25px}.topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:8px}.topic-btn{height:40px;border:1px solid #e7e7ea;border-radius:10px;background:#fff;color:#aaa;font:16px inherit;cursor:pointer}.topic-btn.selected{border-color:#ff4d57;color:#ff4d57}.header-preview{height:367px;position:relative;border-radius:0;overflow:hidden;background:#f0f0f0}.header-preview img{width:100%;height:100%;object-fit:cover}.header-overlay{position:absolute;left:8%;top:38%;width:48%;text-align:center;font-family:HeaderFont,Arial,"Microsoft YaHei",sans-serif;display:flex;flex-direction:column;align-items:center}.header-overlay strong{font-size:30px;line-height:1.2;color:#050505;font-weight:700}.header-overlay span{margin-top:6px;padding:4px 28px;border-radius:18px;background:#ff4d57;color:#fff;font-size:14px}.head-preview{padding:20px 24px}
.header-overlay strong,.header-overlay span{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;cursor:move;user-select:none}.header-overlay{height:100%;top:0;left:0;width:100%;display:block}.header-overlay strong{font-family:HeaderFont,Arial,"Microsoft YaHei",sans-serif}.header-overlay span{margin-top:0}
.header-overlay strong.dragging,.header-overlay span.dragging{cursor:grabbing}
.header-preview img{object-fit:contain;background:#fff}
.header-overlay span{background:transparent;padding:0;border-radius:0}
.header-overlay span{font-family:PingFangCustom,Arial,"Microsoft YaHei",sans-serif}.header-overlay strong em{font-style:normal;color:#FF3131}

.header-overlay span{text-align:center}


.header-overlay strong{font-family:HeaderDianHei,Arial,"Microsoft YaHei",sans-serif}

.header-overlay strong em{font-family:JDZheng,Arial,"Microsoft YaHei",sans-serif;font-weight:400}

.header-overlay strong em{font-size:1.15em}

.coupon-workspace{grid-template-columns:minmax(0,calc((70% - 20px)/2.22)) minmax(0,1fr);width:100%;align-items:start}

.actions button{height:46px;padding:0 51px;font-size:16px;border-radius:8px}

#aiSend{background:transparent url("./assets/ai-send-idle.png") center/contain no-repeat;font-size:0;color:transparent}#aiSend.ready{background-image:url("./assets/ai-send-ready.png")}#aiSend:hover{filter:none}#aiSend:disabled{opacity:.65;cursor:wait}

.hero .eyebrow{font-size:14px;line-height:21px}.hero h1{font-size:30px;line-height:42px}.hero p{font-size:15px}

.app-shell{padding-top:44px}

.head-preview .generation-meta{text-align:left}

.head-preview .generation-meta{position:relative;top:-52px}
/* November prototype: two-column theme gallery. */
.app-shell{max-width:1440px;padding:68px 34px 62px 50px}
.hero .eyebrow{font-size:16px;line-height:24px;margin-bottom:8px}.hero h1{font-size:36px;line-height:48px}.hero p{font-size:17px;margin:7px 0 39px}
.head-workspace{grid-template-columns:minmax(0,574fr) minmax(0,764fr);gap:18px}
.head-config{padding:20px}.head-config h2{margin-bottom:38px}.head-config label{margin-bottom:26px}.head-config .input-wrap{background:#fafafa}.head-config input{background:transparent}
.gallery-heading{display:flex;align-items:center;justify-content:space-between;margin-top:4px;margin-bottom:18px;height:40px}.gallery-heading label{margin:0;font-size:17px}.gallery-heading select{width:174px;height:40px;border:1px solid #ededee;background:#fafafa;border-radius:10px;padding:0 20px;font:16px inherit;color:#333;cursor:pointer;outline-color:#ef4c52}
.topic-gallery{height:172px;padding:20px 24px 16px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,1fr);gap:10px 46px;border:1px solid #ededee;border-radius:11px;background:#fafafa}
.gallery-thumb{padding:0;border:2px solid transparent;background:none;cursor:pointer;min-width:0;overflow:hidden;display:flex;align-items:center;justify-content:center}.gallery-thumb img{display:block;width:100%;height:100%;object-fit:contain}.gallery-thumb.selected{border-color:#ff5566}.gallery-thumb:focus-visible{outline:2px solid #ff5566;outline-offset:2px}
.head-preview{padding:20px 30px}.head-preview h2{margin:0}.header-preview{width:min(100%,520px);height:auto;aspect-ratio:2/1;margin:90px auto 0;background:transparent}.header-preview img{display:block;width:100%;height:100%;object-fit:contain}.head-preview .generation-meta{position:static;top:auto;text-align:center;margin-top:72px;font-size:14px;color:#aaa}
.header-overlay strong{line-height:1.2}.header-overlay span{line-height:1.3;color:#fff}
.actions{margin-top:39px}.actions button{height:57px;padding:0 42px;font-size:23px;border-radius:10px;font-weight:600}
@media(max-width:1200px){.topic-gallery{gap:10px 20px;padding:20px 14px}.header-preview{margin-top:90px}.head-preview .generation-meta{margin-top:72px}}

/* Coupon configuration layout matching the approved reference. */
.coupon-workspace{grid-template-columns:minmax(0,574fr) minmax(0,756fr);gap:18px;width:calc(100% - 10px);margin-left:10px}
.coupon-config{padding:20px 28px 24px 20px;scrollbar-width:thin;scrollbar-color:#c5c5c5 transparent}
.coupon-config h2{position:sticky;top:-20px;z-index:2;background:#fff;padding:0 0 20px;margin:0 0 18px}
.coupon-config>label{margin:0 0 26px;font-size:17px;line-height:24px}.coupon-config .input-wrap{height:40px;margin-top:8px;background:#fafafa;border-color:#ededee;padding:0 14px}.coupon-config input{background:transparent}.coupon-config .palette-group:first-of-type{margin-top:72px}
.coupon-preview-panel{padding:20px 22px}.coupon-preview-panel h2{margin-bottom:27px}.coupon-preview-panel .layout-choice{gap:36px;margin:0 0 20px}.coupon-preview-panel .layout-choice label{display:flex;flex-direction:row-reverse;align-items:center;gap:7px}.coupon-preview-panel .layout-choice input{margin:0}
.coupon-preview-area{height:272px;display:flex;align-items:center;justify-content:center}
.coupon-card:not(.double){width:450px;max-width:100%;height:84px;flex:none;padding:0 17px 0 20px;gap:12px}.coupon-card:not(.double) .coupon-badge{left:0;top:0;border-radius:10px 0 8px 0;font-size:12px;padding:2px 12px;line-height:16px}.coupon-card:not(.double) .coupon-benefit{min-width:100px}.coupon-card:not(.double) .coupon-copy{flex:1}.coupon-card:not(.double) button{transform:none;margin-left:auto;font-size:14px;padding:7px 19px;height:32px;line-height:18px;flex-shrink:0}
.coupon-preview-panel .export-size{position:absolute;bottom:42px;left:0;width:100%;text-align:center;font-size:14px}