:root{--purple:#8f22e8;--purple-dark:#7215ca;--bg:#f5f5f7;--line:#e4e4e9;--text:#17171b;--muted:#73737d;--white:#fff;--poster:#f0f0f0}*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--text);background:var(--bg)}button,input,textarea{font:inherit}button{cursor:pointer}.app-shell{height:100vh;min-height:720px;display:grid;grid-template-rows:62px 1fr 30px;overflow:hidden}.topbar{display:grid;grid-template-columns:350px 1fr 330px auto;align-items:center;padding:0 18px;border-bottom:1px solid var(--line);background:#fff;gap:16px}.brand{display:flex;align-items:center;gap:11px;font-size:20px}.brand-mark{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:900;font-style:italic;background:var(--purple);transform:rotate(-10deg)}.doc-title,.history{display:flex;align-items:center;gap:12px;color:#3f3f48;font-size:13px}.dot{color:#c4c4ca}.saved{font-size:12px;color:#777780}.saved::first-letter{color:#27ae60}.icon-btn,.ghost-btn,.primary-btn{border:1px solid var(--line);background:#fff;border-radius:8px;height:36px;padding:0 14px}.icon-btn{border:0;font-size:21px;padding:0 6px}.top-actions{display:flex;gap:10px;justify-content:flex-end}.primary-btn,.generate-btn{background:var(--purple);color:#fff;border-color:var(--purple);font-weight:700;box-shadow:0 5px 14px rgba(143,34,232,.2)}.workspace{min-height:0;display:grid;grid-template-columns:350px minmax(610px,1fr) 340px}.panel{background:#fff;min-width:0}.settings-panel{border-right:1px solid var(--line);display:grid;grid-template-rows:1fr auto;min-height:0}.panel-scroll,.result-scroll{overflow:auto;padding:20px 18px}.panel-scroll h2{font-size:16px;margin:0 0 18px}.field-label{display:block;font-size:12px;font-weight:650;color:#44444c;margin:13px 0 7px}.panel input,.panel textarea{width:100%;border:1px solid #dedee5;border-radius:6px;background:#fff;padding:9px 10px;font-size:12px;outline:none;resize:none;transition:.2s}.panel input:focus,.panel textarea:focus{border-color:var(--purple);box-shadow:0 0 0 3px rgba(143,34,232,.08)}.platform-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px}.platform{height:38px;border:1px solid #dedee5;border-radius:7px;background:white}.platform.active{border-color:var(--purple);background:#fbf6ff;box-shadow:0 0 0 1px var(--purple)}.xhs-dot,.ks-dot{display:inline-grid;place-items:center;width:20px;height:20px;color:#fff;border-radius:6px;background:#ff2442;font-size:10px}.ks-dot{background:#ff5d28}.row-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px}.generate-box{padding:12px 18px 14px;border-top:1px solid var(--line);background:white}.page-count{display:flex;align-items:center;gap:9px;font-size:12px;margin-bottom:10px}.page-count button{width:26px;height:25px;border:1px solid var(--line);background:white;border-radius:5px}.generate-btn{width:100%;height:42px;border:0;border-radius:7px}.editor-area{min-width:0;display:grid;grid-template-rows:70px 1fr;background:#f1f1f4}.editor-toolbar{background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding-left:128px;gap:8px}.tool{width:56px;height:54px;border:0;background:transparent;border-radius:7px;font-size:20px;display:grid;place-items:center;color:#292930}.tool span{font-size:10px}.tool.active{background:#f2f2f5}.tool.compact{width:42px;color:#777780}.tool-divider{height:30px;width:1px;background:var(--line);margin:0 5px}.tool.danger{color:#adadb5}.stage-wrap{display:grid;grid-template-columns:128px 1fr;min-height:0}.thumb-rail{background:#fafafa;border-right:1px solid var(--line);padding:14px 10px;overflow:auto}.rail-heading{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin:0 2px 12px}.rail-heading button{border:1px solid var(--line);background:white;border-radius:5px}.thumb{border:2px solid transparent;border-radius:6px;margin-bottom:12px;padding:4px;background:white;transition:.2s}.thumb.active{border-color:var(--purple);box-shadow:0 3px 10px rgba(143,34,232,.15)}.thumb-preview{aspect-ratio:3/4;background:#ededed;position:relative;overflow:hidden;border-radius:3px}.thumb-preview::before{content:"";display:block;height:13%;background:repeating-conic-gradient(var(--purple) 0 25%,#eee 0 50%) 0/18px 18px}.thumb-preview strong{display:block;font-size:6px;line-height:1.2;padding:8px 7px}.thumb-meta{font-size:9px;padding-top:5px;display:flex;gap:6px}.thumb.active .thumb-meta{color:var(--purple);font-weight:700}.canvas-region{position:relative;display:grid;place-items:center;padding:18px;overflow:auto}.poster{width:min(50vh,430px);aspect-ratio:3/4;background:var(--poster);border-radius:22px;overflow:hidden;box-shadow:0 15px 40px rgba(24,24,32,.14);position:relative;transform-origin:center;transition:.25s}.checker{height:9%;background-color:#eee;background-image:linear-gradient(45deg,var(--poster-purple) 25%,transparent 25%),linear-gradient(-45deg,var(--poster-purple) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--poster-purple) 75%),linear-gradient(-45deg,transparent 75%,var(--poster-purple) 75%);background-size:38px 38px;background-position:0 0,0 19px,19px -19px,-19px 0}.poster-body{height:82%;padding:11% 10% 5%;position:relative}.poster-title{font-family:Impact,"Arial Black","PingFang SC",sans-serif;font-weight:1000;font-size:clamp(24px,2.5vw,40px);line-height:1.32;letter-spacing:-1.5px;position:relative;z-index:3}.marker-blue{background:linear-gradient(transparent 63%,var(--poster-blue) 63% 92%,transparent 92%)}.circle-word{position:relative;white-space:nowrap}.circle-word::after{content:"";position:absolute;border:5px solid var(--poster-yellow);border-radius:50%;inset:-6px -9px -3px;transform:rotate(-8deg)}.poster-cards{height:42%;position:relative;margin-top:8%}.bank-card{position:absolute;width:55%;aspect-ratio:1.6;border-radius:9px;padding:9px;color:#fff;box-shadow:0 9px 18px rgba(0,0,0,.13);background:linear-gradient(120deg,#a9cbd5,#edf2f2 45%,#7fa0ac);font-size:7px;overflow:hidden}.bank-card::after{content:"IHG  |  ONE REWARDS";position:absolute;top:10px;right:9px;font-size:6px;color:#243b43}.bank-card.one{left:2%;top:2%}.bank-card.two{right:0;bottom:0;filter:brightness(.94)}.chip{position:absolute;width:22px;height:16px;border-radius:4px;background:#c9cbcb;top:34px;left:21px}.card-word{position:absolute;left:10px;top:10px}.poster-note{position:absolute;left:10%;right:9%;bottom:4%;font-weight:800;font-size:11px;line-height:1.45}.footer-purple{height:9%;background:var(--poster-purple);position:relative}.footer-purple::before,.footer-purple::after{content:"";position:absolute;width:120px;height:1px;background:white;left:38%;top:48%;transform:rotate(5deg)}.footer-purple::after{transform:rotate(-5deg)}.smiley{position:absolute;right:9%;bottom:4%;width:48px;height:48px;background:#ffd400;border:5px solid #111;border-radius:50%;z-index:6;box-shadow:3px 3px 0 #111}.smiley::before{content:"•  •";font-size:18px;font-weight:900;position:absolute;left:8px;top:3px}.smiley::after{content:"⌣";font-size:23px;font-weight:900;position:absolute;left:9px;top:14px}.page-detail h3{font-size:20px;margin:0 0 10%}.detail-line{display:grid;grid-template-columns:58px 1fr;gap:16px;margin:8% 0;align-items:start}.detail-icon{width:46px;height:46px;border-radius:14px;background:#d8efff;display:grid;place-items:center;font-size:24px}.detail-copy strong{font-size:15px}.detail-copy p{font-size:11px;line-height:1.55;margin:6px 0}.zoom-control{position:absolute;bottom:16px;display:flex;background:white;border:1px solid var(--line);border-radius:7px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.08)}.zoom-control button,.zoom-control span{height:30px;min-width:34px;border:0;background:white;display:grid;place-items:center;font-size:11px}.tabs{height:64px;display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}.tab{border:0;background:white;position:relative}.tab.active{color:var(--purple);font-weight:700}.tab.active::after{content:"";position:absolute;height:3px;background:var(--purple);left:20px;right:20px;bottom:0}.result-panel{border-left:1px solid var(--line);display:grid;grid-template-rows:64px 1fr;min-height:0}.section-title{font-size:12px;font-weight:750;margin:4px 0 10px;display:flex;justify-content:space-between}.copy-card{padding:12px;border:1px solid var(--line);border-radius:7px;margin-bottom:9px;font-size:12px;line-height:1.55;background:#fff;position:relative}.copy-card.selected{border-color:var(--purple);background:#fcf9ff}.copy-card.selected::after{content:"✓";position:absolute;right:8px;top:8px;width:17px;height:17px;display:grid;place-items:center;background:var(--purple);color:#fff;border-radius:50%;font-size:10px}.wide-action{width:100%;height:38px;border:1px solid var(--line);background:#fff;border-radius:7px;margin:4px 0 20px}.body-copy{min-height:116px}.copy-mini{border:0;background:transparent;color:#666;font-size:11px}.tags{display:flex;flex-wrap:wrap;gap:6px}.tag{background:#f1f1f4;border-radius:4px;padding:5px 7px;font-size:10px}.style-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.swatch{height:72px;border:1px solid var(--line);border-radius:7px;background:var(--swatch);display:flex;align-items:end;padding:7px;color:#fff;font-size:10px;font-weight:700}.swatch.selected{outline:2px solid var(--purple);outline-offset:2px}.page-row{padding:10px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;font-size:12px}footer{background:#fff;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:10px;color:#8a8a93}.toast{position:fixed;left:50%;bottom:54px;transform:translate(-50%,20px);background:#17171b;color:#fff;border-radius:8px;padding:10px 15px;font-size:12px;opacity:0;pointer-events:none;transition:.25s;z-index:30}.toast.show{opacity:1;transform:translate(-50%,0)}.preview-modal{position:fixed;inset:0;background:rgba(17,17,22,.84);z-index:20;display:grid;place-items:center}.preview-modal[hidden]{display:none}.preview-modal>button{position:absolute;right:28px;top:18px;border:0;background:transparent;color:#fff;font-size:32px}.preview-modal .poster{width:min(66vh,520px)}@media(max-width:1100px){.workspace{grid-template-columns:290px minmax(510px,1fr) 300px}.topbar{grid-template-columns:260px 1fr auto}.history{display:none}.settings-panel .panel-scroll{padding:16px 12px}.poster{width:min(46vh,380px)}}@media(max-width:850px){.app-shell{height:auto;min-height:100vh;overflow:visible;grid-template-rows:58px auto 30px}.topbar{position:sticky;top:0;z-index:10;grid-template-columns:1fr auto;padding:0 12px}.doc-title{display:none}.workspace{display:block}.settings-panel{border:0}.panel-scroll{max-height:none}.editor-area{height:760px}.result-panel{border:0;min-height:580px}.stage-wrap{grid-template-columns:90px 1fr}.editor-toolbar{padding-left:95px}.top-actions .ghost-btn{display:none}.poster{width:min(65vw,400px)}footer{position:relative}.row-fields{grid-template-columns:1fr}}