@charset "UTF-8";
:root{--ink:#1d2d45;--text:#242d3b;--muted:#7e8999;--line:#e3e7ec;--bg:#f4f6f9;--primary:#2d64b3;--accent:#c2d5f1;--highlight:#cf4949;--sans:"Inter","PingFang SC","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:13px;-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.65}button{border:0;background:none;color:inherit}a{color:inherit;text-decoration:none}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}button:focus-visible,a:focus-visible{outline:3px solid #7c9bc9;outline-offset:4px;border-radius:5px}input:focus,textarea:focus,select:focus{outline:none;border-color:#798ba5;box-shadow:0 0 0 3px #40659c15}input,textarea,select{border:1px solid #dde1e7;border-radius:7px;background:#fff;color:var(--text);transition:border-color .15s,box-shadow .15s;min-width:0}input::placeholder,textarea::placeholder{color:#9ba3b0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app-header{height:78px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 38px;gap:24px}.header-actions{margin-left:auto;display:flex;align-items:center;gap:25px}.auto-save i,.settings-button i{display:inline-block;width:5px;height:5px;background:#5e84be;border-radius:50%}.text-button,.settings-button{display:flex;align-items:center;gap:7px;font-size:12px}.text-button{color:#687485}.text-button svg,.settings-button svg{width:16px;height:16px}.settings-button{padding:10px 13px;border:1px solid #dde1e7;border-radius:7px}.settings-button i{background:#b8bec8}.settings-button i.connected{background:#4771b1}
.workspace{max-width:1630px;margin:auto;display:grid;grid-template-columns:385px minmax(0,1fr);min-height:calc(100vh - 78px)}.editor-panel{background:#fff;border-right:1px solid var(--line);padding:32px 28px 20px}.section-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px;gap:8px}.section-label h2{font-size:13px;display:flex;align-items:center;gap:8px;margin:0;font-weight:650}.step-number{font-size:10px;color:#6f86a9;letter-spacing:1px;font-weight:500}.small-link{font-size:10px;color:#6b7a91;display:flex;gap:5px;align-items:center;padding:0}.small-link svg{width:12px;height:12px}.prompt-box{border:1px solid #d6dee9;border-radius:9px;background:#f8fafe;overflow:hidden;transition:border-color .2s,box-shadow .2s}.prompt-box:focus-within{border-color:#6e87ad;box-shadow:0 0 0 3px #40659c10}.prompt-box textarea{display:block;resize:vertical;min-height:135px;max-height:300px;height:143px;border:0;border-radius:0;box-shadow:none!important;width:100%;background:transparent;padding:14px 14px 7px;font-size:12px;line-height:1.9}.prompt-box textarea::placeholder{color:#939fb0}.prompt-footer{display:flex;justify-content:space-between;padding:7px 13px 12px;color:#8595ad;font-size:9px}.prompt-footer>span:first-child{display:flex;align-items:center;gap:4px}.prompt-footer svg{width:12px;height:12px}.generate-button{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;background:var(--primary);color:#fff;border-radius:7px;height:43px;margin-top:12px;font-weight:500;font-size:12px;transition:background .2s,transform .2s}.generate-button:hover,.export-button:hover,.primary-button:hover{background:#214f94}.generate-button:active,.export-button:active{transform:translateY(1px)}.generate-button svg{width:16px;height:16px;color:#c2d5f1}.generate-button .arrow{margin-left:10px;width:14px}.generation-feedback{border-radius:6px;padding:10px 12px;background:#e5edf8;color:#405d88;font-size:11px;line-height:1.8;margin:-10px 0 24px}.generation-feedback.error{background:#fbefea;color:#a95b3d}.details-section{border-top:1px solid var(--line);padding-top:22px}.auto-save{font-size:9px;color:#8795a9;display:flex;align-items:center;gap:4px}.auto-save i{width:4px;height:4px}.student-form{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px}.student-form label{display:block;font-size:10px;color:#707c8f;line-height:1.8}.student-form label>span:not(.field-hint){color:#8098bb}.student-form input,.student-form select,.student-form textarea{display:block;width:100%;padding:9px 10px;margin-top:5px;font-size:11px;line-height:1.5;height:35px;border-radius:6px}.student-form textarea{height:58px;resize:vertical;min-height:58px;max-height:130px}.student-form select{padding-right:22px;appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m3 4 3 3 3-3' fill='none' stroke='%23828fa3'/%3E%3C/svg%3E") right 10px center no-repeat}.full{grid-column:1/-1}.field-hint{float:right;font-size:9px;color:#909eb3}.fixed-note{display:flex;align-items:flex-start;gap:8px;background:#f0f4fb;border:1px solid #e4eaf4;border-radius:7px;padding:11px 12px;margin-top:15px;color:#6b80a0}.fixed-note svg{width:14px;height:14px;margin-top:2px}.fixed-note p{font-size:10px;line-height:1.8;margin:0}.fixed-note p span{color:#8c9bb2;font-size:9px}
.preview-panel{min-width:0;padding:28px 38px 20px;background:#f3f5f8}.preview-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px}.preview-toolbar h2{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:600;margin:0 0 6px}.preview-status{font-size:9px;font-weight:400;border:1px solid #d5dde9;color:#7285a2;background:#f1f5fc;padding:3px 7px;border-radius:4px}.preview-toolbar p{font-size:10px;color:#8b97a8;margin:0}.preview-actions{display:flex;gap:13px;align-items:center}.icon-button{display:inline-flex;justify-content:center;align-items:center;width:32px;height:32px;color:#7f8da1;border-radius:5px}.icon-button:hover{background:#e0e6f0}.icon-button svg{width:17px;height:17px}.export-button{display:flex;align-items:center;gap:8px;padding:11px 17px;background:var(--primary);border-radius:6px;color:#fff;font-size:11px;transition:background .2s,transform .2s}.export-button svg{width:14px;height:14px}.preview-controls{display:flex;align-items:center;gap:16px;border-top:1px solid var(--line);margin-top:21px;padding-top:16px}.format-switch{display:flex;background:#e2e8f0;border-radius:6px;padding:3px;gap:3px}.format-switch button{display:flex;gap:6px;align-items:center;font-size:10px;color:#7a889d;padding:8px 12px;border-radius:4px;transition:background .15s,color .15s}.format-switch button.active{background:white;color:#3d516e;box-shadow:0 1px 4px #0d1e3810}.format-switch svg{width:12px;height:12px}.dimensions{font-size:9px;letter-spacing:.2px;color:#8a97ab}.zoom-button{display:flex;gap:5px;align-items:center;margin-left:auto;font-size:10px;color:#7b8aa1;padding:5px}.zoom-button svg{width:13px;height:13px}.poster-stage{margin-top:20px;position:relative;padding:27px 25px 18px;background-color:#e7ebf2;background-image:radial-gradient(#bfc9d7 .6px,transparent .6px);background-size:12px 12px;border:1px solid #dbe2ec;border-radius:8px;display:flex;align-items:center;flex-direction:column;min-height:600px}.poster-paper{width:min(100%,552px);background:#fafcfe;box-shadow:0 3px 7px #1d314f0b,0 16px 28px #1d314f0d;border:1px solid #d9e1ec;transition:width .3s}.poster-paper.mobile{width:min(100%,420px)}#posterCanvas{display:block;width:100%;height:auto}
dialog{border:1px solid #d9e1ec;padding:0;color:var(--text);box-shadow:0 30px 90px #0e1c3030}dialog::backdrop{background:#1823345e;backdrop-filter:blur(5px)}.modal{width:min(490px,calc(100% - 32px));max-height:calc(100dvh - 48px);border-radius:16px;padding:28px}.modal-heading{display:flex;justify-content:space-between;align-items:flex-start}.modal-heading h2{font-size:23px;letter-spacing:.3px;margin:8px 0 0}.modal-heading .close-dialog{margin-top:-6px;margin-right:-6px}.modal-intro{font-size:12px;line-height:1.9;color:#768499;margin:17px 0 21px}.modal form>label{display:block;font-size:12px;color:#54647b;margin-top:17px}.modal input:not([type=checkbox]){display:block;width:100%;height:41px;padding:10px 12px;margin-top:7px;font-size:12px}.modal label small{display:block;color:#8796ad;font-size:10px;margin-top:6px;line-height:1.6}.key-input{position:relative}.key-input input{padding-right:55px!important}.key-input button{position:absolute;right:7px;top:8px;font-size:11px;padding:6px 8px;color:#6e809a}.modal form>.checkbox-label{display:flex;gap:7px;align-items:center;margin-top:17px;font-size:11px}.checkbox-label input{accent-color:var(--primary);width:14px;height:14px;margin:0}.privacy-note{display:flex;gap:8px;background:#eff3fa;padding:11px 12px;border-radius:7px;margin-top:17px;color:#7a8ca7}.privacy-note svg{width:14px;height:14px;margin-top:2px}.privacy-note p{margin:0;font-size:10px;line-height:1.9}.modal-footer{display:flex;justify-content:space-between;gap:12px;margin-top:24px}.primary-button,.secondary-button{padding:11px 20px;border-radius:6px;font-size:12px}.primary-button{background:var(--primary);color:#fff}.secondary-button{border:1px solid #d2dcea;color:#6b7f9c}.form-error{font-size:11px;color:#b36347;line-height:1.7}.help-steps{list-style:none;margin:25px 0;padding:0;display:grid;gap:22px}.help-steps li{display:flex;gap:14px}.help-steps li>span{font-size:12px;color:#6d88b1;background:#e2ebf8;width:30px;height:30px;border-radius:7px;flex-shrink:0;display:grid;place-items:center}.help-steps h3,.help-template h3{font-size:13px;font-weight:600;margin:3px 0 7px}.help-steps p,.help-template p{font-size:11px;line-height:1.9;color:#7586a0;margin:0}.help-template{background:#eff3fa;padding:16px;border-radius:8px}.help-footnote{font-size:10px;line-height:1.9;color:#8c9bb2;margin-bottom:0}.poster-modal{width:min(850px,calc(100% - 24px));max-height:94dvh;border-radius:12px;background:#f2f4f8}.poster-modal img{display:block;max-width:100%;width:100%;height:auto}.enlarged-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;font-size:12px;position:sticky;top:0;background:#f2f4f8f5;border-bottom:1px solid var(--line)}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,15px);background:#21334d;color:#e8effa;padding:13px 23px;border-radius:9px;box-shadow:0 5px 20px #19273c22;font-size:12px;opacity:0;pointer-events:none;transition:transform .2s,opacity .2s;z-index:100;max-width:calc(100% - 32px);line-height:1.7;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}.loading svg:first-child{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{50%{opacity:.3;transform:scale(.85)}}[hidden]{display:none!important}
@media(min-width:1450px){.workspace{grid-template-columns:414px minmax(0,1fr)}.editor-panel{padding:36px 36px 24px}.preview-panel{padding:32px 48px 20px}.poster-paper{width:580px}.poster-stage{padding-top:30px}}
@media(max-width:1100px){.app-header{padding:0 24px;gap:18px}.workspace{grid-template-columns:340px minmax(0,1fr)}.editor-panel{padding:28px 22px 20px}.preview-panel{padding:26px 24px 20px}.preview-controls{gap:10px}.dimensions{font-size:8px}.format-switch button{padding:8px}.poster-stage{padding:22px 18px 18px;min-height:0}}
@media(max-width:800px){.workspace{grid-template-columns:310px minmax(0,1fr)}.app-header{height:68px;padding:0 20px;gap:15px}.header-actions{gap:14px}.text-button span{display:none}.editor-panel{padding:25px 20px}.preview-panel{padding:25px 18px 18px}.preview-actions{gap:5px}.preview-toolbar h2{font-size:14px;gap:6px}.preview-toolbar p{display:none}.preview-status{font-size:8px}.export-button{padding:10px 12px;font-size:10px}.preview-controls{flex-wrap:wrap;gap:7px}.dimensions{order:3;width:100%;padding-top:3px}.format-switch button{font-size:9px;padding:7px}.poster-stage{padding:16px 11px}.zoom-button span{display:none}.preview-toolbar .icon-button{width:26px}.student-form{gap:13px 10px}}
@media(max-width:640px){.app-header{padding:0 17px;gap:12px;height:65px}.header-actions{gap:11px}.settings-button{font-size:11px;padding:8px 10px}.text-button{padding:4px}.workspace{display:flex;flex-direction:column}.editor-panel{border-right:0;border-bottom:1px solid var(--line);padding:28px 22px 22px}.prompt-box textarea{height:125px;min-height:125px;font-size:13px}.prompt-footer{font-size:10px}.section-label h2{font-size:13px}.generate-button{height:46px;font-size:13px}.student-form input,.student-form select,.student-form textarea{font-size:12px;height:40px}.student-form textarea{height:62px}.student-form label{font-size:11px}.student-form{gap:14px}.fixed-note p{font-size:11px}.fixed-note p span{font-size:10px}.preview-panel{padding:23px 15px 18px}.preview-toolbar{padding:0 5px}.preview-toolbar h2{font-size:16px}.preview-toolbar p{display:block;font-size:10px;margin-top:8px}.preview-status{font-size:9px}.export-button{font-size:11px;padding:11px 15px}.preview-actions{gap:8px}.preview-controls{flex-wrap:nowrap;gap:10px;margin-top:19px}.format-switch button{font-size:10px;padding:8px 10px}.dimensions{order:0;width:auto;font-size:8px;margin-left:auto}.zoom-button{margin-left:0}.poster-stage{padding:22px 17px 16px;margin-top:15px}.modal{padding:23px}.modal-heading h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.app-title{margin:0;font-size:18px;font-weight:600;letter-spacing:.3px;color:var(--ink)}
.app-header{height:68px}.workspace{min-height:calc(100vh - 68px)}.input-section{padding-bottom:24px}.generation-feedback{margin:12px 0 0}.preview-toolbar h2{margin:0}.poster-stage{background-image:none;background-color:#edf2f8}.poster-paper{background:#fff}.fixed-note{justify-content:center}.modal-heading h2{margin-top:0}
@media(max-width:640px){.app-title{font-size:17px}.app-header{height:60px}.editor-panel{padding-top:24px}.preview-panel{padding-top:21px}.generation-feedback{margin-bottom:0}}
/* Preview transforms stay inside a stable viewport. */
.preview-zoom{display:flex;align-items:center;gap:2px;margin-left:auto;border:1px solid #d5dde9;border-radius:5px;background:#fff;flex-shrink:0}.preview-zoom button{height:28px;min-width:26px;padding:0 6px;font-size:14px;color:#536b8d}.preview-zoom button[data-zoom="reset"]{min-width:47px;font-size:10px;font-variant-numeric:tabular-nums}.preview-zoom button:hover{background:#edf2fa}.preview-zoom button:disabled{opacity:.3;cursor:default}.zoom-button{margin-left:0}.poster-stage{overflow:hidden;isolation:isolate;cursor:grab;touch-action:pan-y;user-select:none}.poster-stage:focus-visible,.enlarged-stage:focus-visible{outline:2px solid #739cce;outline-offset:2px}.poster-paper{transform-origin:0 0;transition:none;will-change:transform}.preview-gesture-hint{position:absolute;bottom:7px;right:12px;font-size:9px;color:#7a8ca4;background:#edf2f8e8;padding:3px 7px;border-radius:4px;pointer-events:none;z-index:1}.is-dragging{cursor:grabbing!important}.enlarged-stage{position:relative;display:flex;align-items:center;justify-content:center;height:min(80dvh,1000px);padding:20px;overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none;isolation:isolate}.poster-modal .enlarged-stage img{position:relative;display:block;flex:none;width:auto;height:auto;max-width:100%;max-height:100%;transform-origin:0 0;will-change:transform;box-shadow:0 5px 24px #1d314f12}.enlarged-toolbar{gap:12px}.enlarged-toolbar .preview-zoom{margin-left:auto}.poster-modal{overflow:hidden}.preview-controls{column-gap:10px}
@media(max-width:800px){.preview-controls{flex-wrap:wrap}.preview-zoom{margin-left:auto}.preview-controls .dimensions{order:3;width:auto;margin:0 auto 0 0}.preview-controls .zoom-button{order:4}.preview-controls .format-switch{max-width:100%}.preview-gesture-hint{font-size:8px}.enlarged-toolbar>span{font-size:10px}}
/* Desktop uses the available browser viewport; narrow screens keep natural flow. */
@media(min-width:960px){
  html,body{height:100%;overflow:hidden}
  body{display:flex;flex-direction:column;height:100dvh}
  .app-header{flex:0 0 68px}
  .workspace{flex:1;min-height:0;width:100%;overflow:hidden}
  .editor-panel{min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable}
  .preview-panel{display:flex;flex-direction:column;min-height:0;overflow:hidden}
  .preview-toolbar,.preview-controls{flex-shrink:0}
  .preview-controls{flex-wrap:wrap;row-gap:8px}
  .poster-stage{flex:1;min-height:0;justify-content:center;padding:20px 24px 32px}
  .poster-paper{flex:none;min-width:0;max-width:100%}
}
@media(max-width:959px){
  .workspace{display:flex;flex-direction:column;min-height:0}
  .editor-panel{border-right:0;border-bottom:1px solid var(--line)}
  .preview-controls{flex-wrap:wrap;row-gap:8px}
  .poster-paper{flex:none}
}
@media(min-width:960px) and (max-height:700px){
  .preview-panel{padding:16px 24px}
  .preview-controls{margin-top:12px;padding-top:10px}
  .poster-stage{margin-top:12px;padding:12px 18px 28px}
}
.course-settings{margin-bottom:24px;padding-bottom:21px;border-bottom:1px solid var(--line)}.course-settings h2{font-size:13px;font-weight:650;margin:0 0 14px}.course-settings fieldset{border:0;padding:0;margin:0;display:flex;gap:8px;min-width:0}.course-settings fieldset+fieldset{margin-top:15px}.course-settings legend{font-size:10px;color:#707c8f;padding:0;margin-bottom:8px}.course-settings legend span{color:#8a97ab;margin-left:4px;font-size:9px}.course-settings label{flex:1;cursor:pointer;min-width:0;display:flex;align-items:center;justify-content:center;gap:5px;padding:9px 4px;border:1px solid #dde1e7;border-radius:6px;font-size:11px;color:#63748e;background:#fff}.course-settings input{margin:0;width:13px;height:13px;accent-color:var(--primary);flex:none}.course-settings label:has(input:checked){background:#edf3fc;border-color:#7c9bc9;color:#254d85}.course-settings label:has(input:focus-visible){outline:2px solid #739cce;outline-offset:2px}@media(max-width:640px){.course-settings label{padding:12px 5px;font-size:12px}.course-settings legend{font-size:11px}}