*,*:before,*:after{box-sizing:border-box}:root{--bg: #f0eeec;--surface: #ffffff;--primary: #0f6cbd;--primary-hv: #0d5fa8;--text: #111111;--muted: #5f5d5b;--border: #dddbd9;--error: #c4262e;--r-md: 12px;--r-sm: 8px;--r-xs: 6px;--topbar-h: 52px;color-scheme:light;font-family:Aptos,Segoe UI,Hiragino Sans,sans-serif;font-size:14px;color:var(--text)}body{margin:0;height:100dvh;display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}#app{flex:1;display:flex;flex-direction:column;min-height:0}button,input{font:inherit}button{appearance:none;cursor:pointer}.topbar{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--topbar-h);padding:0 14px;background:var(--surface);border-bottom:1px solid var(--border);z-index:10}.topbar-brand{font-size:.95rem;font-weight:700;letter-spacing:-.02em;color:var(--text);text-decoration:none}.topbar-actions{display:flex;gap:6px}.export-btn{position:relative;display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 13px;border:1px solid var(--primary);border-radius:var(--r-sm);background:transparent;color:var(--primary);font-size:.82rem;font-weight:600;white-space:nowrap;transition:background .12s,color .12s,opacity .12s}.export-btn:hover:not(:disabled){background:var(--primary);color:#fff}.export-btn:disabled{opacity:.32;cursor:default}.export-btn[data-loading]{pointer-events:none;color:transparent}.export-btn[data-loading] svg{opacity:0}.export-btn[data-loading]:after{content:"";position:absolute;inset:50% auto auto 50%;translate:-50% -50%;width:13px;height:13px;border:2px solid var(--primary);border-top-color:transparent;border-radius:50%;animation:spin .65s linear infinite}@keyframes spin{to{rotate:1turn}}.shell{flex:1;display:flex;flex-direction:column;min-height:0}.workspace{flex:1;min-height:0;display:grid;grid-template-columns:288px minmax(0,1fr);gap:10px;padding:10px}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden}.sidebar{display:flex;flex-direction:column;gap:8px;padding:10px;min-height:0}.dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:18px 14px;border:1.5px dashed var(--border);border-radius:var(--r-sm);background:#faf9f8;text-align:center;cursor:pointer;transition:border-color .14s,background .14s;flex-shrink:0}.dropzone:hover,.dropzone.dragging{border-color:var(--primary);background:#f0f6fc}.dropzone-icon{color:#b0aeac;transition:color .14s,transform .2s}.dropzone:hover .dropzone-icon,.dropzone.dragging .dropzone-icon{color:var(--primary);transform:translateY(-2px)}.dropzone-title{font-size:.875rem;font-weight:600;color:var(--text)}.dropzone-hint{font-size:.78rem;color:var(--muted)}.sample-btn{height:30px;padding:0 12px;border:1px solid var(--border);border-radius:var(--r-sm);background:transparent;color:var(--muted);font-size:.78rem;transition:border-color .12s,color .12s;flex-shrink:0}.sample-btn:hover{border-color:#b0aeac;color:var(--text)}.sample-btn:disabled{opacity:.4;cursor:default}.pages-header{display:flex;align-items:center;justify-content:space-between;padding:2px;font-size:.72rem;font-weight:700;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;flex-shrink:0}.pages-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#edecea;color:var(--muted);font-size:.72rem;font-weight:700;font-variant-numeric:tabular-nums;transition:background .15s,color .15s}.page-list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:5px;padding-right:2px}.page-list-empty{margin:0;padding:14px;border:1px dashed var(--border);border-radius:var(--r-sm);color:var(--muted);font-size:.82rem;text-align:center;background:#faf9f8}.page-card[draggable=true]{cursor:grab}.page-card[draggable=true]:active{cursor:grabbing}.page-card button{cursor:pointer}.page-card.dragging{opacity:.35;scale:.97}.page-card.drag-before,.page-card.drag-after{position:relative}.page-card.drag-before:before,.page-card.drag-after:after{content:"";position:absolute;left:0;right:0;height:2px;background:var(--primary);border-radius:1px;pointer-events:none;z-index:2}.page-card.drag-before:before{top:-3px}.page-card.drag-after:after{bottom:-3px}.page-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px;padding:7px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface);transition:border-color .12s,box-shadow .12s}.page-card:hover{border-color:#c2c0be;box-shadow:0 1px 4px #0000000d}.page-card.active{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary) inset}.page-card-main{display:grid;grid-template-columns:20px minmax(0,1fr);gap:7px;align-items:start;padding:0;border:0;background:transparent;text-align:left}.page-index{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:999px;background:#edecea;color:var(--muted);font-size:.7rem;font-weight:700;flex-shrink:0;transition:background .15s,color .15s}.page-card.active .page-index{background:var(--primary);color:#fff}.page-thumb-stage{display:grid;place-items:center;width:100%;min-height:96px;padding:5px;border:1px solid #edecea;border-radius:var(--r-xs);background:#f4f3f2;overflow:hidden}.page-thumb-canvas{position:relative}.page-thumb-viewport{position:absolute;inset:0 auto auto 0;transform-origin:top left;overflow:hidden;background:#fff}.page-card-text{display:grid;gap:1px;margin-top:5px}.page-card-text strong{font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.page-card-text span{font-size:.75rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.page-delete{align-self:start;display:grid;place-items:center;width:26px;height:26px;border:1px solid transparent;border-radius:var(--r-xs);background:transparent;color:var(--muted);opacity:0;transition:opacity .12s,background .12s,border-color .12s,color .12s}.page-card:hover .page-delete,.page-card.active .page-delete{opacity:1}.page-delete:hover{background:#fff0ef;border-color:#f5c2be;color:var(--error)}.status{margin:0;padding:0 2px;color:var(--muted);font-size:.78rem;line-height:1.5;flex-shrink:0;min-height:1.2em}.status[data-error=true]{color:var(--error)}.preview-panel{display:flex;flex-direction:column;min-height:0}.preview-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 13px;border-bottom:1px solid var(--border);flex-shrink:0}.preview-meta{display:flex;flex-direction:column;gap:1px;min-width:0}.preview-meta strong{font-size:.88rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-meta span,.preview-side-meta{color:var(--muted);font-size:.78rem}.preview-side-meta{display:flex;flex-direction:column;align-items:flex-end;gap:1px;flex-shrink:0}.scale-reset-btn{padding:0;border:0;background:transparent;color:var(--muted);font-size:.78rem;font-variant-numeric:tabular-nums;cursor:pointer;transition:color .12s}.scale-reset-btn:hover{color:var(--primary)}.preview-stage{flex:1;min-height:0;display:grid;place-items:center;padding:20px;overflow:hidden;cursor:grab;-webkit-user-select:none;user-select:none;background-color:#e8e6e4;background-image:linear-gradient(45deg,#dedddb 25%,transparent 25%),linear-gradient(-45deg,#dedddb 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dedddb 75%),linear-gradient(-45deg,transparent 75%,#dedddb 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}.preview-stage.panning{cursor:grabbing}.preview-canvas{position:relative;display:grid;place-items:center;width:100%;height:100%;max-width:100%;max-height:100%}.embedded-document{position:relative;width:100%;height:100%;overflow:hidden}.embedded-document>*{max-width:100%;max-height:100%;width:100%;height:auto;box-sizing:border-box}.viewport{position:absolute;overflow:hidden;background:#fff;transform-origin:center center;box-shadow:0 8px 32px #00000029,0 2px 8px #00000014}.viewport.empty{position:relative;inset:auto;width:min(100%,680px);min-height:360px;display:grid;place-items:center;translate:none;box-shadow:none;background:#ffffffb3;border:1.5px dashed #c8c6c4;border-radius:var(--r-md)}.preview-root,.embedded-document{width:100%;height:100%}.embedded-document>*{max-width:100%}.placeholder{display:flex;flex-direction:column;align-items:center;gap:10px;color:#b0aeac;pointer-events:none;-webkit-user-select:none;user-select:none}.placeholder svg{opacity:.5}.placeholder p{margin:0;font-size:.88rem;color:var(--muted);text-align:center}.placeholder-sub{font-size:.78rem!important;color:#b0aeac!important}.viewport.empty .preview-root{display:none}.viewport:not(.empty) .placeholder{display:none}@media(max-width:960px){.workspace{grid-template-columns:250px minmax(0,1fr)}}@media(max-width:700px){body{height:auto;overflow:auto}.workspace{grid-template-columns:1fr;height:auto;overflow:visible}.topbar-brand{font-size:.88rem}.export-btn{padding:0 10px}.preview-stage{min-height:380px}}