:root{--poster-ink:#282724;--poster-muted:#807d76;--poster-line:#e2e0dc;--poster-black:#171816;--poster-green:#638878}*{box-sizing:border-box}body{margin:0}.poster-demo{min-height:100vh;padding:18px;color:var(--poster-ink);background:#efefec;font-family:var(--sans),sans-serif}.poster-context{width:min(1540px,100%);min-height:58px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin:0 auto 14px;padding:0 10px}.poster-context a{color:#5d625e;font-size:11px;text-decoration:none}.poster-context>div{text-align:center}.poster-context span,.poster-context strong{display:block}.poster-context strong{font:500 14px/1.3 var(--serif)}.poster-context span{margin-top:4px;color:#8f918c;font-size:8px;letter-spacing:.12em}.poster-context button{justify-self:end;padding:9px 14px;border:1px solid #d3d5d1;border-radius:999px;color:#555b57;background:#fafbf9;font-size:10px;cursor:pointer}.poster-shell{width:min(1540px,100%);height:calc(100dvh - 108px);min-height:580px;display:grid;grid-template-rows:66px minmax(0,1fr);margin:auto;overflow:hidden;border:1px solid #d9dbd7;border-radius:22px;background:#fff;box-shadow:0 28px 80px rgba(46,48,44,.12)}.poster-appbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 22px;border-bottom:1px solid var(--poster-line);background:#fff}.poster-brand{display:flex;align-items:center;gap:10px}.poster-brand>i{display:grid;width:36px;height:36px;place-items:center;border-radius:10px;color:#fff;background:var(--poster-black);font-style:normal}.poster-brand small,.poster-brand span,.poster-brand strong{display:block}.poster-brand strong{font-size:12px}.poster-brand small{margin-top:3px;color:#999892;font-size:8px}.poster-appbar nav{display:flex;gap:3px;padding:3px;border-radius:10px;background:#f2f2ef}.poster-appbar nav button{padding:7px 11px;border:0;border-radius:7px;color:#8d8c86;background:transparent;font-size:8px;cursor:pointer}.poster-appbar nav button.active{color:#252621;background:#fff;box-shadow:0 2px 7px rgba(30,32,29,.1)}.mock-badge{justify-self:end;padding:6px 8px;border:1px solid #d7d9d5;border-radius:6px;color:#777b76;font-size:7px;letter-spacing:.1em}.create-workspace{min-height:0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.75fr);overflow:auto;background:linear-gradient(135deg,#fbfbf9,#f3f3ef)}.copy-panel,.template-panel{padding:clamp(28px,4vw,55px)}.copy-panel{border-right:1px solid var(--poster-line)}.copy-panel header>span,.editor-workspace header span,.template-panel header>span{color:var(--poster-green);font-size:7px;letter-spacing:.14em}.copy-panel h1,.editor-workspace h1,.template-panel h2{margin:10px 0 12px;font:500 clamp(30px,4vw,50px)/1.1 var(--serif)}.copy-panel header p,.editor-workspace header p{max-width:560px;margin:0 0 24px;color:var(--poster-muted);font-size:10px;line-height:1.75}.copy-panel textarea{width:100%;height:calc(100% - 175px);min-height:330px;resize:none;padding:22px;border:1px solid #dedfdc;border-radius:14px;outline:none;color:#4f514d;background:#fff;font:11px/1.9 var(--sans);box-shadow:0 12px 30px rgba(39,41,38,.05)}.copy-panel textarea:focus{border-color:#88a497;box-shadow:0 0 0 4px #e8efeb}.copy-meta{display:flex;justify-content:space-between;margin-top:12px;color:#92938e;font-size:8px}.copy-meta button{border:0;color:#626660;background:transparent;font-size:8px}.template-panel h2{font-size:clamp(26px,3vw,38px)}.template-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}.template-grid button{display:grid;grid-template-columns:44px 1fr auto;gap:11px;align-items:center;min-height:76px;padding:11px;border:1px solid #dedfdb;border-radius:12px;text-align:left;background:#fff;cursor:pointer;transition:transform .18s ease,border-color .18s ease}.template-grid button:hover{transform:translateY(-2px)}.template-grid button.selected{border:2px solid #2a2b28}.template-grid i{width:44px;height:52px;border-radius:7px;opacity:.86}.template-grid span,.template-grid strong{display:block}.template-grid strong{font:500 11px/1.4 var(--serif)}.template-grid span{margin-top:4px;color:#92938e;font-size:7px}.template-grid b{color:#6e736e;font-size:7px;font-weight:500}.visual-plan{margin:18px 0;padding:14px 16px;border-radius:11px;background:#f0f4f1}.visual-plan small{color:var(--poster-green);font-size:7px;letter-spacing:.12em}.visual-plan p{margin:7px 0 0;color:#606861;font-size:9px;line-height:1.65}.generate-button{width:100%;height:48px;border:0;border-radius:11px;color:#fff;background:var(--poster-black);font-size:10px;cursor:pointer}.generate-button:disabled{opacity:.65}.generation-progress{display:grid;gap:8px;margin:17px 0 0;padding:0;list-style:none}.generation-progress li{display:flex;align-items:center;gap:9px;color:#a2a39e;font-size:8px}.generation-progress i{display:grid;width:20px;height:20px;place-items:center;border:1px solid #dcddd9;border-radius:50%;font-style:normal}.generation-progress li.running{color:#445d52}.generation-progress li.running i{border-color:#6f9182;box-shadow:0 0 0 4px #e8efeb}.generation-progress li.done i{color:#fff;border-color:var(--poster-green);background:var(--poster-green)}.result-workspace{min-height:0;display:grid;grid-template-columns:180px minmax(340px,1fr) 290px;overflow:hidden}.record-rail{display:flex;flex-direction:column;gap:9px;padding:21px 14px;overflow:auto;border-right:1px solid var(--poster-line);background:#f7f7f4}.record-rail>span{margin:0 5px 8px;color:#7e827d;font-size:8px}.record-rail button{display:grid;grid-template-columns:28px 1fr;gap:6px;padding:10px;border:1px solid transparent;border-radius:10px;text-align:left;background:#fff;cursor:pointer}.record-rail button.active{border-color:#2d2e2b}.record-rail i{grid-row:1/3;color:#999b96;font-size:7px;font-style:normal}.record-rail strong{font:500 10px/1.3 var(--serif)}.record-rail small{color:#999b96;font-size:7px}.result-stage{min-width:0;position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:20px 24px;overflow:hidden;background:#eceeeb}.stage-title{display:flex;align-items:baseline;gap:12px;padding-bottom:14px}.stage-title span{color:var(--poster-green);font-size:7px;letter-spacing:.12em}.stage-title strong{font:500 16px/1.3 var(--serif)}.stage-title small{margin-left:auto;color:#949691;font-size:7px}.editor-workspace figure,.result-stage figure{position:relative;min-height:0;margin:0;overflow:hidden;border:1px solid #d8dad6;border-radius:13px;background:#fff;box-shadow:0 16px 40px rgba(38,40,37,.1)}.long-poster-canvas{display:flex;justify-content:center;align-items:flex-start;overflow:auto!important;padding:42px 30px 70px;background-color:#e7e9e6!important;background-image:linear-gradient(#dfe2de 1px,transparent 0),linear-gradient(90deg,#dfe2de 1px,transparent 0)!important;background-size:24px 24px!important}.long-poster-canvas img{width:min(100%,390px);height:auto;border-radius:2px;box-shadow:0 15px 45px rgba(24,29,26,.2)}.canvas-ruler{position:absolute;top:12px;left:50%;z-index:2;padding:4px 8px;border-radius:5px;color:#6e746f;background:rgba(255,255,255,.82);font-size:7px;transform:translateX(-50%)}.editor-workspace figure img{object-fit:contain}.result-actions{display:flex;justify-content:flex-end;gap:9px;padding-top:14px}.result-actions button{padding:10px 16px;border:1px solid #d4d6d2;border-radius:9px;color:#fff;background:#1d1e1b;font-size:8px;cursor:pointer}.result-actions button:first-child{color:#525651;background:#fff}.result-prompt{display:flex;flex-direction:column;padding:22px 18px;overflow:auto;border-left:1px solid var(--poster-line);background:#fff}.result-prompt header small{color:var(--poster-green);font-size:7px;letter-spacing:.12em}.result-prompt h2{margin:9px 0 5px;font:500 24px/1.2 var(--serif)}.result-prompt header span{color:#92958f;font-size:8px}.result-prompt label{margin-top:25px;color:#6f736e;font-size:8px}.result-prompt textarea{width:100%;height:190px;margin-top:9px;resize:none;padding:13px;border:1px solid #dfe1dd;border-radius:10px;outline:none;color:#555a55;background:#f8f8f6;font:9px/1.75 var(--sans)}.result-prompt textarea:focus{border-color:#8ba598;box-shadow:0 0 0 4px #e9efec}.prompt-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}.prompt-chips span{padding:6px 8px;border-radius:999px;color:#5e7268;background:#edf3f0;font-size:7px}.prompt-info{display:grid;grid-template-columns:1fr 1fr;gap:7px 12px;margin-top:22px;padding-top:17px;border-top:1px solid #e4e6e2}.prompt-info small{color:#999c96;font-size:7px}.prompt-info strong{color:#555b56;font-size:8px;text-align:right}.result-prompt>button{min-height:43px;margin-top:auto;border:0;border-radius:9px;color:#fff;background:#1c1d1b;font-size:8px;cursor:pointer}.editor-workspace{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:18px;padding:24px;overflow:hidden;background:#f1f2ef}.editor-workspace>header{display:flex;justify-content:space-between;align-items:end}.editor-workspace h1{margin-bottom:0;font-size:clamp(25px,3vw,38px)}.editor-workspace header p{margin:0;text-align:right}.edit-simulation{display:flex;flex-direction:column;padding:19px;border:1px solid #dfe0dd;border-radius:13px;background:#fff}.edit-simulation small,.edit-simulation span,.edit-simulation strong{display:block}.edit-simulation small{color:#999b96;font-size:7px}.edit-simulation strong{margin:9px 0 5px;font:500 15px/1.3 var(--serif)}.edit-simulation span{color:#8d908b;font-size:8px}.edit-simulation label{margin-top:25px;color:#666a65;font-size:8px}.edit-simulation textarea{width:100%;height:130px;margin-top:9px;resize:none;padding:12px;border:1px solid #dddeda;border-radius:9px;color:#545853;background:#f8f8f6;font:9px/1.7 var(--sans)}.edit-simulation button{height:43px;margin-top:auto;border:0;border-radius:9px;color:#fff;background:#191a18;font-size:9px;cursor:pointer}.editor-workspace{grid-template-columns:180px minmax(360px,1fr) 300px;grid-template-rows:auto minmax(0,1fr);gap:14px;padding:20px}.editor-workspace>header{grid-column:1/-1}.segment-editor,.segment-rail{min-height:0;overflow:auto;border:1px solid #dfe1dd;border-radius:13px;background:#fff}.segment-rail{padding:14px 11px}.segment-rail>span{display:block;padding:3px 7px 10px;color:#777d78;font-size:8px}.segment-rail button{width:100%;display:flex;align-items:center;gap:9px;padding:10px 8px;border:1px solid transparent;border-radius:9px;text-align:left;background:transparent;cursor:pointer}.segment-rail button:hover{background:#f6f7f5}.segment-rail button.active{border-color:#292a27;background:#fff;box-shadow:0 5px 14px rgba(38,40,37,.08)}.segment-rail .overview-item{justify-content:space-between;margin-bottom:8px;background:#f3f4f1;font-size:9px;font-weight:600}.segment-rail .overview-item small{color:#999c96;font-size:7px;font-weight:400}.segment-rail i{width:25px;color:#8c918c;font-size:7px;font-style:normal}.segment-rail small,.segment-rail strong{display:block}.segment-rail strong{color:#4b504c;font:500 10px/1.4 var(--serif)}.segment-rail small{margin-top:3px;color:#999c96;font-size:7px}.segmented-canvas{min-width:0;min-height:0;display:grid;grid-template-rows:45px minmax(0,1fr);overflow:hidden;border:1px solid #dfe1dd;border-radius:13px;background:#e8eae7}.canvas-toolbar{display:flex;align-items:center;gap:15px;padding:0 15px;border-bottom:1px solid #dfe1dd;background:#fff}.canvas-toolbar span{font:500 13px/1 var(--serif)}.canvas-toolbar b{margin-left:auto;padding:6px 9px;border-radius:7px;color:#626863;background:#f1f2ef;font-size:8px}.canvas-toolbar small{color:#7c817c;font-size:8px}.five-segments{display:flex;flex-direction:column;align-items:center;gap:14px;overflow:auto;padding:25px 28px 60px;background-image:linear-gradient(#dfe2de 1px,transparent 0),linear-gradient(90deg,#dfe2de 1px,transparent 0);background-size:24px 24px}.segment-row{width:min(100%,720px);display:grid;grid-template-columns:minmax(260px,440px) minmax(150px,1fr);align-items:start;gap:28px}.segment-image{position:relative;width:100%;flex:0 0 auto;overflow:hidden;padding:0;border:2px solid transparent;border-radius:5px;background:#fff;box-shadow:0 10px 28px rgba(33,38,35,.13);cursor:pointer}.segment-row.selected .segment-image{border-color:#278971;box-shadow:0 0 0 3px rgba(39,137,113,.14),0 13px 30px rgba(33,38,35,.16)}.segment-image>span{position:absolute;top:8px;left:8px;z-index:2;padding:5px 8px;border-radius:999px;color:#fff;background:rgba(19,32,28,.75);font-size:7px}.segment-candidate>img,.segment-image>img{position:absolute;top:0;left:0;width:100%;height:auto;max-width:none}.segment-annotation{position:relative;max-height:calc(100% - 22px);margin-top:22px;overflow:auto;border:1px solid #d9ded9;border-radius:3px;background:rgba(255,255,255,.97);box-shadow:0 8px 20px rgba(38,43,39,.08)}.segment-annotation:before{content:"";position:absolute;top:22px;right:100%;width:29px;border-top:2px dashed #65ad9b}.segment-annotation:after{content:"";position:absolute;top:18px;right:calc(100% + 25px);width:7px;height:7px;border:2px solid #65ad9b;border-radius:50%;background:#f1f2ef}.segment-annotation header{position:sticky;top:0;z-index:2;padding:10px 11px 8px;border-bottom:1px solid #e5e7e3;background:rgba(255,255,255,.97)}.segment-annotation header h3{margin:0;color:#4a514d;font:600 13px/1.35 var(--serif)}.segment-annotation header small{display:block;margin-top:4px;color:#969c97;font-size:7px}.annotation-legend{display:flex;flex-wrap:wrap;gap:7px;padding:8px 11px;border-bottom:1px solid #eceeea;background:#fafbf9}.annotation-legend span{position:relative;padding-left:11px;color:#727872;font-size:6px}.annotation-legend span:before{content:"";position:absolute;top:1px;left:0;width:7px;height:7px;border-radius:50%;background:#59ae99}.annotation-legend .source{color:#7658d2}.annotation-legend .source:before{background:#7047eb}.annotation-legend .unused:before{background:#2476dc}.annotation-legend .check:before{background:#df2147}.annotation-copy{display:grid;gap:6px;padding:9px 11px 14px}.annotation-copy p{margin:0;padding:4px 5px;border-radius:4px;color:#315f55;background:#e2f1ec;font:7px/1.58 var(--sans);white-space:pre-wrap;overflow-wrap:anywhere}.annotation-copy p.source{color:#6144ae;background:#eee8fb}.annotation-copy p.unused{color:#2768ad;background:#e7f0fb}.annotation-copy p.check{border-bottom:2px solid #df2147;color:#5f4449;background:#f9e8ec}.segment-row:not(.selected) .segment-annotation{opacity:.62}.segment-editor{display:flex;flex-direction:column;padding:17px}.segment-editor header small{color:#999c96;font-size:7px}.segment-editor h2{margin:9px 0 5px;font:500 20px/1.25 var(--serif)}.segment-editor header span{color:#8f938d;font-size:7px}.segment-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:17px 0}.segment-stats span{padding:10px;border-radius:8px;color:#92958f;background:#f5f6f4;font-size:7px}.segment-stats b{display:block;margin-top:5px;color:#545a55;font-size:9px}.segment-editor label{display:block;margin-top:11px;color:#686d68;font-size:8px}.segment-editor textarea{width:100%;height:94px;margin-top:7px;resize:none;padding:10px;border:1px solid #dfe1dd;border-radius:8px;color:#555a55;background:#f8f8f6;font:8px/1.65 var(--sans)}.segment-editor>button{min-height:42px;margin-top:14px;border:0;border-radius:8px;color:#fff;background:#171816;font-size:8px;cursor:pointer}.segment-editor>button:disabled{opacity:.55}.segment-candidate{position:relative;flex:0 0 auto;margin-top:14px;overflow:hidden;border:1px solid #d9dcd8;border-radius:9px}.segment-candidate span{top:7px;left:7px;padding:5px 7px;border-radius:5px;background:rgba(20,30,26,.78)}.segment-candidate button,.segment-candidate span{position:absolute;z-index:2;color:#fff;font-size:7px}.segment-candidate button{right:7px;bottom:7px;padding:7px 9px;border:0;border-radius:6px;background:#171816;cursor:pointer}@media(max-width:850px){.poster-demo{padding:0}.poster-context{min-height:64px;grid-template-columns:1fr auto;margin:0;padding:0 14px}.poster-context>div{display:none}.poster-shell{height:calc(100dvh - 64px);min-height:0;border-width:1px 0 0;border-radius:0}.poster-appbar{grid-template-columns:1fr auto;padding:0 13px}.poster-appbar nav{overflow:auto}.mock-badge,.poster-brand span{display:none}.create-workspace{grid-template-columns:1fr}.copy-panel{border-right:0;border-bottom:1px solid var(--poster-line)}.copy-panel,.template-panel{padding:24px 17px}.copy-panel textarea{height:330px}.result-workspace,.template-grid{grid-template-columns:1fr}.result-workspace{overflow:auto}.record-rail{display:none}.result-stage{min-height:72vh;padding:16px 12px}.stage-title{display:grid}.stage-title small{margin:0}.long-poster-canvas{min-height:55vh;padding-right:12px;padding-left:12px}.result-prompt{min-height:500px;border-top:1px solid var(--poster-line);border-left:0}.editor-workspace{grid-template-columns:1fr;grid-template-rows:auto 52vh auto;overflow:auto;padding:18px 12px}.editor-workspace>header{display:block}.editor-workspace header p{text-align:left}.edit-simulation button{margin-top:18px}}@media(prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;transition-duration:.01ms!important}}@media(max-width:850px){.editor-workspace{display:flex;flex-direction:column;overflow:auto}.segment-rail{flex:0 0 auto;overflow:visible}.segmented-canvas{flex:0 0 70vh;min-height:560px}.segment-editor{flex:0 0 auto;min-height:620px}.five-segments{padding-right:12px;padding-left:12px}.segment-row{grid-template-columns:1fr;gap:8px}.segment-annotation{margin-top:0}.segment-annotation:after,.segment-annotation:before{display:none}}