/* editor-shell.css */
#cloudLoginGate,#bootGate{background:linear-gradient(108deg,#f1f2ff,#f7f5ff 44%,#fff8ed)!important;font-family:var(--ui-font,system-ui),sans-serif!important;overflow:hidden}
#cloudLoginGate:before,#bootGate:before{content:"";position:absolute;width:80vw;height:80vw;border-radius:50%;background:radial-gradient(circle,rgba(112,136,255,.22),rgba(255,194,87,.12) 45%,transparent 65%);filter:blur(32px);left:-20vw;top:-35vw;animation:linksoul-light 16s ease-in-out infinite alternate;pointer-events:none}
@keyframes linksoul-light{to{transform:translate(45vw,35vh) rotate(35deg)}}
#cloudLoginGate form{position:relative;width:min(440px,100%);padding:42px;border:1px solid rgba(255,255,255,.9);border-radius:26px;background:rgba(255,255,255,.78);box-shadow:0 24px 80px #59668b18;backdrop-filter:blur(24px);font-size:14px;color:#333}
#cloudLoginGate h1{font-size:28px;letter-spacing:-.6px;line-height:1.5;margin:0 0 32px;font-weight:750}
#cloudLoginGate h1 span{display:block;color:#69738b;font-size:17px;font-weight:500;letter-spacing:2px;margin-bottom:4px}
#cloudLoginGate label{display:block;font-size:13px;font-weight:600;color:#586174}
#cloudLoginGate [hidden]{display:none!important}
#cloudLoginGate input{display:block;width:100%;margin:9px 0 22px;padding:13px 15px;box-sizing:border-box;border:1px solid #dfe4ef;border-radius:11px;background:#ffffffbc;font:15px var(--ui-font,system-ui);outline:none}
#cloudLoginGate input:focus{border-color:#527cff;box-shadow:0 0 0 3px #527cff12}
#cloudLoginGate button{width:100%;height:46px;border:0;border-radius:11px;background:#ffba32;color:#282317;font:700 15px var(--ui-font,system-ui);cursor:pointer;transition:transform .2s,box-shadow .2s}
#cloudLoginGate button:hover{transform:translateY(-1px);box-shadow:0 8px 22px #ffba3235}
#cloudLoginGate [data-intro]:empty{display:none}#cloudLoginGate [data-intro]{font-size:13px;color:#69738b}#cloudLoginGate [data-message]{font-size:13px;color:#b42318;margin-bottom:0}
#bootGate{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px}
.boot-card{position:relative;text-align:center;width:min(420px,100%)}.boot-logo{width:66px;height:66px;object-fit:contain;margin-bottom:18px}.boot-card h1{font-size:28px;margin:0 0 12px;letter-spacing:1px}.boot-card p{color:#758099;font-size:13px;margin:0 0 28px}.boot-card progress{appearance:none;width:100%;height:5px;border:0;border-radius:8px;background:#e5e8f2;overflow:hidden}.boot-card progress::-webkit-progress-bar{background:#e5e8f2}.boot-card progress::-webkit-progress-value{background:linear-gradient(90deg,#547bff,#ad9ff5,#ffba32);transition:width .25s}.boot-card output{display:block;margin-top:12px;font-size:12px;color:#8790a4;font-variant-numeric:tabular-nums}
.top-actions>.button,.top-actions>a.button,.top-actions>button{height:36px!important;padding:0 13px!important;border-radius:9px!important;font:600 13px var(--ui-font,system-ui)!important;white-space:nowrap}
.top-actions #copyBtn{height:38px!important;padding:0 18px!important;background:#ffba32!important;border-color:#ffba32!important;font-weight:750!important}.top-actions #saveStatus{display:none}.shell-more{position:relative}.shell-more>summary{list-style:none;cursor:pointer;height:36px;padding:0 13px;display:flex;align-items:center;border:1px solid #e0e4ed;background:#ffffffa8;border-radius:9px;font-size:13px;font-weight:600;color:#596579}.shell-more>summary::-webkit-details-marker{display:none}.shell-menu{position:absolute;right:0;top:46px;z-index:1000;width:220px;background:#fff;padding:8px;border:1px solid #e7eaf1;border-radius:14px;box-shadow:0 14px 40px #263c6520;display:grid;gap:3px}.shell-menu>*{width:100%;min-height:36px;text-align:left;justify-content:flex-start;border:0!important;background:transparent!important;color:#586174!important;font:500 13px var(--ui-font,system-ui)!important;border-radius:8px!important;padding:9px 12px!important}.shell-menu>*:hover{background:#f3f5fb!important}.shell-menu .shell-menu-heading{font-size:11px!important;color:#9ba4b5!important;min-height:24px;padding:6px 12px!important}
.top-actions [data-icon]:before{content:attr(data-icon);margin-right:7px;font-weight:500;color:inherit}.studio-modal:has(.studio-history){width:min(760px,calc(100vw - 40px))!important;max-height:78vh!important;display:flex;flex-direction:column}.studio-modal:has(.studio-history) .studio-body{min-height:0;max-height:58vh;overflow:auto}.studio-history{display:grid!important;grid-template-columns:1fr!important}
#articleStyleModal .modal-box>p{display:none}.modal-box.workspace-modal{width:min(760px,calc(100vw - 40px))!important;max-height:min(78vh,760px)!important;overflow:auto}.modal-box.workspace-modal .workspace-body{max-height:58vh;overflow:auto}
@media(max-width:1100px){.top{padding-left:14px!important;padding-right:14px!important}.top-actions{gap:5px!important}.top-actions #cloudSyncStatus{max-width:130px;overflow:hidden;text-overflow:ellipsis}.top-actions #cloudAccountBtn{max-width:110px;overflow:hidden;text-overflow:ellipsis}}
@media(prefers-reduced-motion:reduce){#cloudLoginGate:before,#bootGate:before{animation:none}#cloudLoginGate button,.boot-card progress::-webkit-progress-value{transition:none}}
.top{position:relative;isolation:isolate;background:linear-gradient(108deg,#f1f2ff,#f7f5ff 44%,#fff8ed)!important}
.app button:not(.recipe-thumbnail):not(.component-btn):not(.library-item){border-radius:9px;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s}.app button:hover:not(:disabled):not(.recipe-thumbnail){box-shadow:0 2px 9px #415e8c0a}.app button:focus-visible{outline:3px solid #aac4ff;outline-offset:2px}.app [role=tab][aria-selected=true],.app button[aria-pressed=true],.component-categories .active{font-weight:750!important}
.studio-footer button,.modal-box>footer button,.modal-actions button,.workspace-modal footer button{min-height:38px!important;height:38px!important;padding:0 18px!important;font:600 13px var(--ui-font,system-ui)!important;border-radius:9px!important;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
.studio-footer button.primary,.modal-box>footer button.primary,.modal-actions button.primary{background:#ffba32!important;border-color:#ffba32!important;color:#382c15!important}.top-actions #guideBtn,.top-actions #adminEntry{font:600 13px var(--ui-font,system-ui)!important;height:36px!important;padding:0 12px!important;display:inline-flex;align-items:center;text-decoration:none}
@media(prefers-reduced-motion:reduce){.top:before{animation:none}.app button{transition:none!important}}
.top:before,.top-actions:before{animation:none!important}.official-label{display:none!important}.top-actions>button,.top-actions>a{min-height:36px;font-size:13px;font-weight:600}.image-item{min-width:0;overflow:hidden}.image-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-meta{min-width:0}.image-category{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recipe-row{display:grid;grid-template-columns:minmax(130px,34%) minmax(0,1fr);align-items:center;gap:18px}.recipe-row-copy{min-width:0}.recipe-row .template-actions{display:flex;gap:6px;flex-wrap:wrap}.recipe-row .template-actions button{min-height:36px;font-size:13px}.recipe-thumbnail{width:100%;min-width:0}.recipe-row-copy>h3{line-height:1.5}.modal-box{max-height:85vh}.component-subtabs [aria-selected=true]{font-weight:700!important}@media(max-width:1100px){.recipe-row{grid-template-columns: minmax(110px,32%) minmax(0,1fr);gap:12px}}
html[data-team-templates-loading=true] #officialTemplates .recipe-row,html[data-team-templates-loading=true] [data-component]:not([data-component=custom]){display:none!important}html[data-team-templates-loading=true] #officialTemplates:after{content:'正在读取团队模板…';display:block;padding:20px;color:#7c879c;font-size:13px}html[data-team-assets-loading=true] #imageCollection .image-item{display:none!important}

/* Shared scrollbars and aligned library rails. */
*{scrollbar-width:thin!important;scrollbar-color:#b8c4d4 #f3f5f9!important}*::-webkit-scrollbar{width:8px!important;height:8px!important}*::-webkit-scrollbar-track{background:#f3f5f9;border-radius:8px}*::-webkit-scrollbar-thumb{background:#b8c4d4;border-radius:8px;border:2px solid #f3f5f9}*::-webkit-scrollbar-thumb:hover{background:#9daec3}

.library #componentListViewport,.library #templateListViewport{overflow-x:hidden!important;scrollbar-gutter:stable}.library #imagesPanel #imageCollection{box-sizing:border-box!important;margin:0 -12px!important;width:calc(100% + 24px)!important;max-width:none!important;padding:10px 12px!important;overflow-x:hidden!important;scrollbar-gutter:stable}.library #imagesPanel .image-item{min-width:0!important;max-width:100%!important;overflow:hidden!important}.library #imagesPanel .image-meta{width:100%;min-width:0}.library #imagesPanel .image-name{min-width:0!important;max-width:100%;overflow:hidden!important;text-overflow:ellipsis}.vault-backup-modal{width:min(760px,calc(100vw - 40px))!important;max-height:82vh!important;display:flex!important;flex-direction:column!important;position:relative}.vault-backup-modal .studio-body{min-height:0;overflow:auto;max-height:62vh}.vault-backup-modal .studio-actions{display:flex;flex-wrap:wrap;gap:8px}.vault-backup-modal .vault-location{overflow-wrap:anywhere}.vault-backup-modal p{font-size:13px;line-height:1.7}.vault-backup-modal h2{font-size:20px}.vault-backup-modal .modal-close{position:absolute;right:16px;top:16px}
.library #imagesPanel #imageCollection{margin:0 -11px!important;width:calc(100% + 22px)!important;scrollbar-color:#b8c4d4 #f3f5f9!important}.app *::-webkit-scrollbar-track{background:#f3f5f9!important}.app *::-webkit-scrollbar-thumb{background:#b8c4d4!important;border:2px solid #f3f5f9!important;border-radius:8px!important}.app *::-webkit-scrollbar-thumb:hover{background:#9daec3!important}
.library-upload-progress{display:grid;gap:7px;padding:10px 12px;margin:8px 0;border:1px solid #e0dced;border-radius:10px;background:#f8f7fb;min-width:0}.library-upload-progress span{font-size:12px;color:#756789;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-upload-progress progress{appearance:none;width:100%;height:8px;border:0;border-radius:8px;overflow:hidden;background:#ece9f3}.library-upload-progress progress::-webkit-progress-bar{background:#ece9f3}.library-upload-progress progress::-webkit-progress-value{background:#8974a4;border-radius:8px}.library-upload-progress progress::-moz-progress-bar{background:#8974a4;border-radius:8px}

.library-upload-progress[hidden]{display:none!important}
#cloudLoginGate button[disabled]{cursor:wait;opacity:.72}#cloudLoginGate [data-message]{min-height:20px}

.editor-loading .app{visibility:hidden}html.editor-loading,html.editor-loading body{min-height:100vh;background:linear-gradient(108deg,#f1f2ff,#f7f5ff 44%,#fff8ed)}

    :root{--ui-font:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;--article-font:mp-quote,PingFang SC,system-ui,-apple-system,BlinkMacSystemFont,Helvetica Neue,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Arial,sans-serif}*{box-sizing:border-box} body{margin:0;background:#F7F8FC;color:#202020;font-family:var(--ui-font)}.app{min-height:100vh}.top{height:68px;background:#FFF;border-top:4px solid #2768FF;border-bottom:1px solid #E0E2E4;padding:0 26px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:14px}.brand img{width:146px;height:auto}.brand i{height:24px;width:1px;background:#E0E2E4}.brand span{font-size:12px;color:#999}.top-actions{display:flex;align-items:center;gap:9px}.status{font-size:12px;color:#32A83A}.button{height:34px;border:1px solid #E0E2E4;border-radius:6px;background:#FFF;color:#666;padding:0 12px;font:700 12px var(--ui-font);cursor:pointer}.button:hover{border-color:#2768FF;color:#2768FF}.button.primary{background:#FFBA32;color:#202020;border-color:#FFBA32}.layout{height:calc(100vh - 68px);min-height:690px;display:grid;grid-template-columns:272px minmax(460px,1fr) minmax(410px,1fr)}
    .library{background:#FFF;border-right:1px solid #E0E2E4;overflow:auto}.library-head{padding:18px 16px 13px;border-bottom:1px solid #E0E2E4}.library-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.library h2{font-size:16px;margin:0}.library-copy{margin:7px 0 0;color:#999;font-size:12px;line-height:1.65}.library-actions{display:flex;gap:5px}.small-button{height:28px;border:1px solid #E0E2E4;border-radius:5px;background:#FFF;padding:0 8px;color:#666;font:700 11px var(--ui-font);cursor:pointer}.small-button:hover{border-color:#2768FF;color:#2768FF}.tabs{display:flex;padding:10px 16px 0;gap:15px}.tab{padding:0 0 9px;border:0;border-bottom:2px solid transparent;background:transparent;color:#999;font:700 12px var(--ui-font);cursor:pointer}.tab.active{border-color:#2768FF;color:#2768FF}.library-panel{padding:10px 16px 20px}.library-panel.hidden{display:none}.library-tip{margin:0 0 12px;font-size:11px;color:#999;line-height:1.7}#componentsPanel{display:flex;flex-direction:column}#componentsPanel .library-section:nth-of-type(3){order:2}#componentsPanel .library-section:nth-of-type(2){order:3}#componentsPanel #customComponents{order:4}.library-section{margin:18px 0 0}.library-section h3{display:flex;align-items:center;gap:7px;margin:0 0 9px;color:#3C4A68;font-size:12px}.library-section h3:before{content:"";width:4px;height:14px;border-radius:3px;background:#2768FF}.library-section:nth-of-type(2) h3:before{background:#7A22F6}.library-section:nth-of-type(3) h3:before{background:#FFBA32}.component-card{width:100%;margin:8px 0;padding:11px;border:1px solid #E3E6EC;border-radius:8px;background:#FFF;text-align:left;cursor:pointer;font-family:var(--ui-font);box-shadow:0 1px 1px rgba(32,32,32,.02)}.component-card:hover{border-color:#2768FF;background:#F8FAFF;box-shadow:0 4px 12px rgba(39,104,255,.08)}.component-card-top{display:flex;align-items:center;justify-content:space-between;color:#202020;font-size:12px;font-weight:700}.component-card small{font-size:10px;color:#8790A3;text-decoration:underline}.component-preview{height:48px;margin-top:9px;padding:9px 10px;border-radius:5px;background:#F7F8FC;overflow:hidden}.component-preview .mini-title{height:5px;width:62%;background:#2768FF;border-radius:4px;margin:2px 0 8px}.component-preview .mini-line{height:3px;background:#D9DCE3;border-radius:3px;margin:5px 0}.component-preview .mini-line.short{width:68%}.component-preview.quote{border-left:3px solid #2768FF;background:#F2F6FF}.component-preview.image{display:flex;gap:7px}.component-preview.image i{width:48px;background:#E9EDF5;border-radius:4px}.component-preview.image .mini-lines{flex:1;padding-top:2px}.component-preview.cta{background:#FFF8E7;text-align:center}.component-preview.cta .mini-button{width:58px;height:8px;margin:7px auto;background:#FFBA32;border-radius:4px}.template-zero{margin-top:4px;padding:16px 13px;border:1px dashed #C8CDD8;border-radius:8px;background:#FBFCFF;color:#666}.template-zero b{display:block;color:#202020;font-size:13px}.template-zero p{font-size:12px;line-height:1.7;margin:7px 0 13px}.saved-template{margin:7px 0;padding:10px;border:1px solid #E0E2E4;border-radius:7px;background:#FFF;cursor:pointer}.saved-template:hover{border-color:#2768FF}.saved-template b{font-size:12px}.saved-template span{display:block;margin-top:4px;color:#999;font-size:10px}
    .editor-side{min-width:0;background:#FFF;border-right:1px solid #E0E2E4;display:flex;flex-direction:column}.panel-bar{height:52px;padding:0 18px;border-bottom:1px solid #E0E2E4;display:flex;align-items:center;gap:8px}.panel-bar strong{font-size:14px}.save{margin-left:auto;font-size:12px;color:#32A83A}.tool-popover{position:fixed;z-index:20;display:none;min-width:214px;padding:12px;border:1px solid #E0E2E4;border-radius:8px;background:#FFF;box-shadow:0 12px 28px rgba(32,32,32,.13)}.tool-popover.open{display:block}.tool-popover b{display:block;margin:0 0 9px;font-size:12px}.color-grid{display:grid;grid-template-columns:repeat(6,24px);gap:7px}.swatch{width:24px;height:24px;border:1px solid rgba(32,32,32,.15);border-radius:4px;cursor:pointer}.rgb-row{display:flex;align-items:center;gap:5px;margin-top:12px;padding-top:10px;border-top:1px solid #E9EBF0}.rgb-row span{font-size:11px;color:#999}.rgb-row input{width:38px;height:26px;border:1px solid #D9DDE5;border-radius:4px;padding:0 4px;font-size:11px;outline:none}.rgb-row input:focus{border-color:#2768FF}.rgb-row button{height:26px;border:0;border-radius:4px;background:#2768FF;color:#FFF;padding:0 8px;font:11px var(--ui-font);cursor:pointer}.insert-options{display:grid;grid-template-columns:1fr 1fr;gap:6px}.insert-option{padding:9px;border:1px solid #E0E2E4;border-radius:5px;background:#FFF;color:#666;text-align:left;font:12px var(--ui-font);cursor:pointer}.insert-option:hover{border-color:#2768FF;color:#2768FF;background:#F5F8FF}.editor,.render{font-family:var(--article-font)}.editor{padding:26px 29px;outline:none;overflow:auto;flex:1;font-size:15px;line-height:1.9;color:#666}.editor:focus{box-shadow:inset 3px 0 #2768FF}.editor h1{font-size:26px;line-height:1.45;color:#202020;margin:0 0 18px}.editor h2{font-size:20px;line-height:1.55;color:#202020;margin:34px 0 15px;padding-left:10px;border-left:4px solid #FFBA32}.editor h3{font-size:17px;color:#202020;margin:25px 0 10px}.editor p{margin:0 0 15px}.editor blockquote{margin:18px 0;padding:13px 15px;border-left:4px solid #2768FF;background:#F2F6FF;color:#202020;font-weight:700}.editor pre{margin:18px 0;padding:13px;border-radius:6px;background:#202020;color:#E7EAF0;white-space:pre-wrap;font:12px/1.7 Consolas,monospace}.editor hr{margin:26px 0;border:0;border-top:1px solid #E0E2E4}.editor img{max-width:100%;height:auto;display:block;margin:18px 0;border-radius:7px}.editor ul,.editor ol{padding-left:24px;margin:12px 0}.editor li{margin:7px 0}.editor .check-item{margin:9px 0;color:#666}.editor .check-item input{margin-right:7px;accent-color:#2768FF}.editor .component{margin:20px 0;padding:16px;border-radius:8px;border:1px solid #E0E2E4;background:#FFF;cursor:text}.editor .component.image-note{background:#F8FAFE}.editor .component.cta{background:#FFF9E8;text-align:center;border-color:#F5D789}.editor .component.xiaoling-note{display:flex;gap:12px;background:#F5F8FF;border-color:#C9D8FF}.xiaoling-avatar-slot{flex:0 0 76px;width:76px;height:76px;border-radius:10px;border:1px dashed #8FAEFF;background:#FFF;display:flex;align-items:center;justify-content:center;text-align:center;color:#2768FF;font-size:11px;font-weight:700;cursor:pointer;overflow:hidden}.xiaoling-avatar-slot img{width:100%;height:100%;object-fit:contain;margin:0;border-radius:0}.xiaoling-note-copy{min-width:0;flex:1}.editor .component .label{font-size:10px;font-weight:700;letter-spacing:1px;color:#2768FF;margin-bottom:7px}.editor .component .image-slot{height:116px;border:1px dashed #BFC7D6;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#999;font-size:12px}.editor .component h3{margin:0 0 7px;padding:0;border:0}.editor .component p{margin:0;color:#666;font-size:13px;line-height:1.75}.editor .component button{border:0;background:#FFBA32;color:#202020;border-radius:5px;padding:8px 14px;font:700 12px var(--ui-font)}.editor-foot{height:40px;padding:0 18px;display:flex;align-items:center;border-top:1px solid #E0E2E4;font-size:12px;color:#999}.editor-foot span:last-child{margin-left:auto}
    .preview-side{background-color:#F9FAFE;background-image:radial-gradient(#E0E2E4 1px,transparent 1px);background-size:14px 14px;display:flex;flex-direction:column;min-width:0}.preview-body{padding:24px;overflow:auto;flex:1}.paper{max-width:530px;margin:0 auto;background:#FFF;min-height:720px;padding:30px 46px 45px;border-top:4px solid #2768FF;box-shadow:0 10px 28px rgba(32,32,32,.08)}.paper .author{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px;font-size:12px;color:#666}.paper .author-left{display:flex;gap:8px;align-items:center}.paper .author-logo{width:26px;height:26px;border-radius:6px;background:#FFBA32}.paper .original{font-size:10px;color:#999;border:1px solid #E0E2E4;padding:3px 6px}.render h1{font-size:25px;line-height:1.5;color:#202020;text-align:center;margin:0 0 10px}.render h1:after{content:"";display:block;width:44px;height:5px;background:#FFBA32;margin:16px auto 24px}.render h2{font-size:19px;line-height:1.55;text-align:center;color:#2768FF;margin:38px 0 20px}.render h2 span{display:inline-block;padding:0 7px;border-bottom:8px solid #FFBA32;line-height:1.3}.render h3{font-size:16px;color:#202020;margin:26px 0 10px;padding-left:10px;border-left:4px solid #FFBA32}.render p{font-size:15px;line-height:1.95;color:#666;margin:0 0 16px}.render blockquote{margin:20px 0;color:#2768FF;font-weight:700;font-size:15px;line-height:1.85;padding-left:13px;border-left:3px solid #2768FF}.render img{max-width:100%;height:auto;display:block;margin:20px auto;border-radius:7px}.render ul,.render ol{padding-left:22px;color:#666;font-size:15px;line-height:1.85}.render li{margin:7px 0}.render .component{cursor:default}.render .component h3{border:0;padding:0;font-size:16px}.render .component.cta{border-radius:0}.render .component.xiaoling-note{align-items:flex-start}.component-variants{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:15px 0}.variant-card{padding:11px;border:1px solid #E0E2E4;border-radius:7px;background:#FFF;text-align:left;cursor:pointer}.variant-card.active,.variant-card:hover{border-color:#2768FF;background:#F5F8FF}.variant-card b{display:block;font-size:13px}.variant-card small{display:block;margin:3px 0 9px;color:#999;font-size:11px}.variant-preview{height:100px;padding:10px;overflow:hidden;border-radius:4px;background:#F7F8FC;color:#666;font-size:10px;line-height:1.45}.variant-preview h2{font-size:13px;margin:12px 0;color:#2768FF}.variant-preview blockquote{margin:4px 0;padding-left:6px;border-left:2px solid #2768FF;color:#2768FF}.variant-preview .component{margin:0;padding:8px;font-size:10px}.variant-preview .xiaoling-avatar-slot{width:30px;height:30px;float:left;margin-right:6px;font-size:8px}.modal{position:fixed;inset:0;background:rgba(32,32,32,.22);display:none;align-items:center;justify-content:center;z-index:30}.modal.open{display:flex}.modal-box{width:min(500px,92vw);max-height:82vh;overflow:auto;background:#FFF;border-radius:10px;padding:22px;box-shadow:0 18px 45px rgba(32,32,32,.16)}.modal-box h2{font-size:18px;margin:0 0 8px}.modal-box p{font-size:13px;line-height:1.7;color:#666}.modal-close{float:right;border:0;background:#F1F1F1;border-radius:5px;width:28px;height:28px;font-size:17px;cursor:pointer}.manage-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-top:1px solid #E9EBF0;font-size:13px}.manage-row small{display:block;color:#999;margin-top:3px}.manage-row button{border:0;background:transparent;color:#E25656;font-size:12px;cursor:pointer}.modal-action{width:100%;height:38px;border:0;border-radius:6px;background:#FFBA32;color:#202020;font:700 13px "Microsoft YaHei";cursor:pointer}.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,75px);background:#202020;color:#FFF;border-radius:6px;padding:10px 14px;font-size:12px;transition:.2s;z-index:40}.toast.show{transform:translate(-50%,0)}
    .palette-label{display:block;margin:10px 0 6px;color:#999;font-size:10px}.rgb-row #saveRgb{background:#FFF;color:#2768FF;border:1px solid #2768FF}.image-collection{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}.image-item{position:relative;aspect-ratio:1;border:1px solid #E0E2E4;border-radius:7px;overflow:hidden;background:#F7F8FC;cursor:pointer}.image-item img{width:100%;height:100%;display:block;object-fit:cover}.image-item button{position:absolute;right:4px;top:4px;width:20px;height:20px;border:0;border-radius:50%;background:rgba(32,32,32,.65);color:#FFF;font-size:12px;cursor:pointer}.preview-controls{margin-left:auto;display:flex;gap:5px}.active-preview{border-color:#2768FF;color:#2768FF;background:#F5F8FF}.preview-body{position:relative}.preview-body:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(249,250,254,.86),rgba(249,250,254,.94));pointer-events:none}.preview-body>*{position:relative}.preview-body.phone-scene{background:#EEF2FA}.preview-body.tablet-scene,.preview-body.desktop-scene{background-image:url('images/01-image1.png');background-size:cover;background-position:center top}.preview-body.tablet-scene:before,.preview-body.desktop-scene:before{background:rgba(249,250,254,.82)}.paper.phone{max-width:390px;border-radius:18px;overflow:hidden;border-top-width:0;box-shadow:0 16px 35px rgba(22,34,62,.15)}.paper.tablet{max-width:670px}.paper.desktop{max-width:760px}.preview-side.dark{background-color:#202124;background-image:none}.preview-side.dark .preview-body:before{background:rgba(20,21,24,.9)}.preview-side.dark .paper{background:#191A1C;border-color:#4B7CFF;box-shadow:0 10px 28px rgba(0,0,0,.35)}.preview-side.dark .author,.preview-side.dark .render p{color:#C8CBD2}.preview-side.dark .render h1,.preview-side.dark .render h3{color:#F4F5F7}.preview-side.dark .render h2{color:#80A5FF}.preview-side.dark .render blockquote{color:#8BABFF}.editor .component.info-card{background:#F2F6FF;border-left:4px solid #2768FF}.editor .component.outline-card{background:#FFF;border:1px solid #2768FF}.editor .component.warning-card{background:#FFF8E7;border-left:4px solid #FFBA32}.image-grid{display:grid;gap:7px;margin:10px 0}.image-grid.two{grid-template-columns:1fr 1fr}.image-grid.three{grid-template-columns:repeat(3,1fr)}.image-grid .image-slot{height:95px}.render .image-grid{display:grid;gap:7px}.render .image-grid .image-slot{height:95px;border:1px dashed #BFC7D6;border-radius:5px;display:flex;align-items:center;justify-content:center;color:#999;font-size:11px}.render .component.info-card{background:#F2F6FF;border-left:4px solid #2768FF}.render .component.outline-card{background:#FFF;border:1px solid #2768FF}.render .component.warning-card{background:#FFF8E7;border-left:4px solid #FFBA32}
    /* V2.2 设备预览与工具栏优化 */
    .component-card{min-height:92px;padding:14px 15px}.component-card-top{display:flex;align-items:flex-start;justify-content:space-between}.component-copy{display:flex;flex-direction:column;gap:8px}.component-copy b{font-size:15px;color:#202020}.component-copy small{color:#7D8798;font-size:12px;text-decoration:underline}.component-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:12px;background:#F4F7FF;color:#2768FF}.component-icon svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.component-card[data-component="card"] .component-icon,.component-card[data-component="gallery"] .component-icon{background:#FFF8E7;color:#A96F00}.component-card[data-component="xiaoling"] .component-icon{padding:4px;background:#F5F4FF}.component-card[data-component="xiaoling"] .component-icon img{width:100%;height:100%;object-fit:contain}
    .device-frame{display:none!important}.device-mock.phone{width:min(390px,100%);aspect-ratio:9 / 19.2;padding:43px 9px 11px;background:#202126;border-radius:46px;box-shadow:0 18px 36px rgba(18,24,38,.28)}.device-mock.phone:before{content:"";position:absolute;top:13px;left:50%;width:102px;height:23px;transform:translateX(-50%);border-radius:16px;background:#08090B;z-index:4}.device-mock.phone .paper{position:relative;inset:auto;z-index:1;width:100%;height:100%;padding:25px 20px 34px;overflow:auto;border-radius:34px;box-shadow:none}.device-mock.tablet{width:min(680px,100%);height:660px;padding:12px;background:#202126;border-radius:28px;box-shadow:0 16px 32px rgba(18,24,38,.22)}.device-mock.tablet:before{content:"";position:absolute;top:5px;left:50%;width:6px;height:6px;transform:translateX(-50%);border-radius:50%;background:#555B66}.device-mock.tablet .paper{max-width:none;width:100%;height:636px;min-height:0;overflow:auto;border-radius:18px;box-shadow:none}.device-mock.desktop{width:min(820px,100%);height:620px;padding:12px 12px 22px;background:#292C33;border:1px solid #454A55;border-radius:13px;box-shadow:0 18px 34px rgba(18,24,38,.24)}.device-mock.desktop:before{content:"";position:absolute;top:5px;left:50%;width:40px;height:4px;transform:translateX(-50%);border-radius:0 0 4px 4px;background:#3B404A}.device-mock.desktop:after{content:"";position:absolute;bottom:-24px;left:50%;width:122px;height:24px;transform:translateX(-50%);border-radius:0 0 8px 8px;background:linear-gradient(90deg,#555B66,#30333A,#555B66)}.device-mock.desktop .paper{max-width:none;width:100%;height:586px;min-height:0;overflow:auto;border-radius:4px;box-shadow:none}.device-mock.device-dark .paper{background:#191A1C;border-color:#4B7CFF}.device-mock.device-dark .author,.device-mock.device-dark .render p{color:#C8CBD2}.device-mock.device-dark .render h1,.device-mock.device-dark .render h3{color:#F4F5F7}.device-mock.device-dark .render h2{color:#80A5FF}.device-mock.device-dark .render blockquote{color:#8BABFF}
    /* V2.1 交互与预览优化 */
    .tab{position:relative;transition:color .18s ease}.tab:after{content:"";position:absolute;left:50%;bottom:-2px;width:0;height:2px;border-radius:2px;background:#2768FF;transform:translateX(-50%);transition:width .2s ease}.tab.active:after{width:100%}.library-panel:not(.hidden){animation:panel-in .2s ease both}@keyframes panel-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.component-preview{display:none}.component-card{min-height:48px;display:flex;align-items:center}.component-card-top{width:100%}.tool-popover{min-width:320px}.rgb-row{flex-wrap:wrap}.rgb-row input{width:36px}.rgb-row input#rgbA{width:46px}.palette-label{margin-top:12px}.preview-body{display:flex;align-items:flex-start;justify-content:center;padding:30px 24px 42px}.device-mock{position:relative;display:flex;justify-content:center}.device-mock.phone{width:min(390px,100%);aspect-ratio:1091 / 2260}.device-mock.tablet,.device-mock.desktop{width:100%}.device-mock.phone .paper{position:absolute;inset:6.2% 5.2% 4.7%;z-index:1;max-width:none;min-height:0;height:auto;overflow:auto;padding:28px 24px 36px;border:0;border-radius:0;box-shadow:none}.device-frame{display:none}.device-mock.phone .device-frame{display:block;position:absolute;z-index:2;inset:0;width:100%;height:100%;pointer-events:none}.device-mock.tablet .device-frame,.device-mock.desktop .device-frame{display:none}.device-mock.tablet .paper{max-width:670px}.device-mock.desktop .paper{max-width:760px}.preview-side.dark .device-mock.phone .paper{border:0}.preview-side.dark .device-frame{filter:brightness(.82)}
    @media(max-width:1080px){.layout{grid-template-columns:235px 1fr 1fr}.library-head{padding-left:13px;padding-right:13px}.library-panel{padding-left:13px;padding-right:13px}.paper{padding:28px}}@media(max-width:800px){.top{padding:0 14px}.brand i,.brand span,.status{display:none}.layout{height:auto;display:block}.library{display:none}.editor-side{height:auto;min-height:60vh}.preview-side{height:70vh}.paper{padding:26px 23px}.editor{padding:20px}.panel-bar{padding:0 14px}.preview-body{padding:16px}}
    /* V2.3：iPad 与桌面端采用真实的阅读容器，而非在设备框内放一张“白纸” */
    .preview-body.tablet-scene{background:#E9EDF5;background-image:linear-gradient(135deg,rgba(255,255,255,.72),rgba(218,226,240,.7))}.preview-body.desktop-scene{background:#E9EDF5;background-image:linear-gradient(135deg,#EEF1F6 0%,#DCE2EC 100%)}.preview-body.tablet-scene:before,.preview-body.desktop-scene:before{background:rgba(247,249,253,.36)}.device-ui{display:none;position:absolute;z-index:3;pointer-events:none;font-family:var(--ui-font);user-select:none}.tablet-systembar{height:30px;align-items:center;justify-content:space-between;padding:0 20px;color:#F7F8FC;font-size:10px;font-weight:700;letter-spacing:.15px}.tablet-systembar .tablet-app{display:flex;align-items:center;gap:6px}.tablet-systembar .tablet-dot{width:16px;height:16px;border-radius:5px;background:#FFBA32;box-shadow:inset 0 0 0 4px rgba(255,255,255,.26)}.tablet-systembar .tablet-actions{display:flex;gap:10px;align-items:center;color:#C9CED8;font-size:12px}.browser-chrome{top:0;left:0;right:0;height:48px;display:flex;align-items:center;gap:13px;padding:0 16px;background:linear-gradient(180deg,#F7F8FA,#ECEEF2);border-bottom:1px solid #DDE0E6;border-radius:12px 12px 0 0;color:#636A76;font-size:11px}.browser-nav{display:flex;gap:8px;align-items:center;font-size:18px;line-height:1}.browser-tab{display:flex;align-items:center;gap:7px;width:min(225px,36%);height:29px;padding:0 10px;border:1px solid #E1E4E9;border-radius:7px;background:#FFF;color:#323844;font-size:11px;white-space:nowrap;overflow:hidden}.browser-tab:before{content:"";flex:0 0 13px;width:13px;height:13px;border-radius:4px;background:#FFBA32;box-shadow:inset 0 0 0 3px rgba(255,255,255,.38)}.browser-tab span{overflow:hidden;text-overflow:ellipsis}.browser-address{height:28px;flex:1;max-width:360px;padding:0 11px;display:flex;align-items:center;gap:7px;border-radius:7px;background:#E5E7EB;color:#8B919D}.browser-address:before{content:"⌕";font-size:16px;color:#747B87}.browser-actions{display:flex;align-items:center;gap:11px;margin-left:auto;font-size:15px}.browser-actions .browser-ai{padding:4px 7px;border:1px solid #D8DCE3;border-radius:5px;font-size:10px;color:#313744;background:#FFF}.device-frame{display:none!important}
    .device-mock.phone{width:min(390px,100%);aspect-ratio:9 / 19.2;padding:43px 9px 11px;background:#202126;border-radius:46px;box-shadow:0 18px 36px rgba(18,24,38,.28)}.device-mock.phone:before{content:"";position:absolute;top:13px;left:50%;width:102px;height:23px;transform:translateX(-50%);border-radius:16px;background:#08090B;z-index:4}.device-mock.phone .paper{position:relative;inset:auto;z-index:1;width:100%;height:100%;padding:25px 20px 34px;overflow:auto;border-radius:34px;box-shadow:none}
    .device-mock.tablet{width:min(760px,100%);height:min(62vw,590px);min-height:440px;padding:30px 12px 12px;background:linear-gradient(135deg,#4B515C,#1E2229 42%,#343A45);border:1px solid #606775;border-radius:29px;box-shadow:0 24px 50px rgba(25,34,52,.26),inset 0 1px 1px rgba(255,255,255,.18)}.device-mock.tablet:before{content:"";position:absolute;top:11px;left:50%;width:6px;height:6px;transform:translateX(-50%);border-radius:50%;background:#11141A;box-shadow:0 0 0 1px #596170}.device-mock.tablet .tablet-systembar{display:flex;top:0;left:0;right:0}.device-mock.tablet .paper{position:relative;z-index:1;max-width:none;width:100%;height:100%;min-height:0;overflow:auto;padding:31px clamp(38px,8vw,86px) 55px;border-radius:18px;box-shadow:inset 0 0 0 1px rgba(32,32,32,.08);scrollbar-color:#B8BFCA transparent}.device-mock.tablet .paper:before{content:"灵心平台 · 公众号文章";display:block;margin:-31px clamp(-38px,-8vw,-86px) 28px;padding:12px clamp(38px,8vw,86px);border-bottom:1px solid #EEF0F3;background:#FFF;color:#9299A6;font-size:11px;letter-spacing:.4px}.device-mock.tablet .paper::-webkit-scrollbar,.device-mock.desktop .paper::-webkit-scrollbar{width:6px}.device-mock.tablet .paper::-webkit-scrollbar-thumb,.device-mock.desktop .paper::-webkit-scrollbar-thumb{border-radius:8px;background:#C5CBD5}
    .device-mock.desktop{width:min(950px,100%);height:min(61vw,650px);min-height:470px;padding:48px 0 0;background:#F4F5F7;border:1px solid #D9DDE3;border-radius:13px;box-shadow:0 22px 52px rgba(24,34,54,.22),0 2px 7px rgba(24,34,54,.08);overflow:hidden}.device-mock.desktop:before{content:"";position:absolute;top:-6px;left:50%;width:74px;height:9px;transform:translateX(-50%);border-radius:0 0 8px 8px;background:#CCD1D9}.device-mock.desktop:after{content:"";position:absolute;bottom:-18px;left:50%;width:160px;height:18px;transform:translateX(-50%);border-radius:0 0 14px 14px;background:linear-gradient(90deg,#C8CDD5,#F0F1F4 50%,#C8CDD5);box-shadow:0 9px 16px rgba(44,52,66,.17)}.device-mock.desktop .browser-chrome{display:flex}.device-mock.desktop .paper{position:relative;z-index:1;max-width:none;width:100%;height:100%;min-height:0;overflow:auto;padding:39px clamp(36px,9.5vw,115px) 76px;border:0;border-radius:0;box-shadow:none;background:#FFF;scrollbar-color:#AEB4BE transparent}.device-mock.desktop .paper::-webkit-scrollbar{width:7px}.device-mock.desktop .paper::-webkit-scrollbar-thumb{background:#AEB4BE}.device-mock.desktop .paper{display:flex;flex-direction:column}.device-mock.desktop .paper .render{display:contents}.device-mock.desktop .paper .render>*{order:3}.device-mock.desktop .paper .render h1{order:1;text-align:left;font-size:27px;line-height:1.42;letter-spacing:-.45px;margin:0 0 0}.device-mock.desktop .paper .render h1:after{display:none}.device-mock.desktop .paper .author{order:2;justify-content:flex-start;gap:14px;margin:14px 0 32px;color:#9AA1AC}.device-mock.desktop .paper .author-logo{width:24px;height:24px;border-radius:7px}.device-mock.desktop .paper .original{border:0;padding:0;color:#B1B6BF;letter-spacing:.5px}.device-mock.desktop .render h2{margin-top:38px;text-align:left;font-size:20px}.device-mock.desktop .render h2 span{padding:0;border-bottom:0;line-height:1.5}.device-mock.desktop .render h3{font-size:17px}.device-mock.desktop .render p,.device-mock.desktop .render li{font-size:16px;line-height:2}.device-mock.desktop .render blockquote{font-size:16px}
    .device-mock.device-dark.tablet{background:linear-gradient(135deg,#2B3039,#101216 42%,#252A32);border-color:#3D4654}.device-mock.device-dark.tablet .paper{background:#191A1C;box-shadow:inset 0 0 0 1px #343842}.device-mock.device-dark.tablet .paper:before{background:#222429;border-bottom-color:#343842;color:#AEB4BE}.device-mock.device-dark.desktop{background:#1D1F23;border-color:#333842}.device-mock.device-dark.desktop .browser-chrome{background:linear-gradient(180deg,#30333A,#25272C);border-bottom-color:#414650;color:#C5CBD5}.device-mock.device-dark.desktop .browser-tab{background:#202227;border-color:#3B414C;color:#E4E7EC}.device-mock.device-dark.desktop .browser-address{background:#1B1D21;color:#8B919D}.device-mock.device-dark.desktop .browser-ai{background:#282B31!important;border-color:#424853!important;color:#D7DBE2!important}.device-mock.device-dark.desktop .paper{background:#191A1C}.device-mock.device-dark .paper::-webkit-scrollbar-thumb{background:#515763}
    /* V2.4：按实际设备比例适配，手机沿用上一版的纵向阅读框 */
    .preview-body{align-items:flex-start}.preview-body.tablet-scene,.preview-body.desktop-scene{align-items:center}
    .device-mock.phone{width:min(390px,100%);aspect-ratio:9 / 19.2;padding:43px 9px 11px;background:#202126;border-radius:46px;box-shadow:0 18px 36px rgba(18,24,38,.28)}
    .device-mock.phone .paper{position:relative;inset:auto;z-index:1;width:100%;height:100%;padding:25px 20px 34px;overflow:auto;border-radius:34px;box-shadow:none}
    .device-mock.tablet{width:min(760px,100%);height:auto;min-height:0;aspect-ratio:4 / 3}
    .device-mock.desktop{width:min(950px,100%);height:auto;min-height:0;aspect-ratio:16 / 10}
    .device-mock.tablet .paper,.device-mock.desktop .paper{height:100%}
    /* 左侧三个页签为互斥资源库，页签头明确当前资源的用途 */
    .library-view-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;padding:9px 10px;border:1px solid #E8EBF1;border-radius:7px;background:#F8FAFE}.library-view-head b{font-size:12px;color:#202020}.library-view-head span{font-size:10px;color:#7D8798}.library-panel.hidden{display:none!important}
    /* 编辑区固定为两行逻辑分组，窄屏时仅组内换行，不再出现横向滑动 */
    
    @media(max-width:1080px){}
    /* 左侧资源库：网格锁定头部与页签；当前页签本身为独立滚动区。 */
    .library{height:100%;display:grid!important;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden!important}.library-head,.tabs{min-width:0}.library-panel{grid-row:3;min-height:0;height:100%;overflow-y:scroll!important;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#AEB9CA transparent}.library-panel::-webkit-scrollbar{width:8px}.library-panel::-webkit-scrollbar-thumb{border:2px solid #FFF;border-radius:10px;background:#AEB9CA}.library-panel::-webkit-scrollbar-track{background:#F3F5F9}#componentsPanel:not(.hidden){display:flex;flex-direction:column}
    /* 依据品牌规范统一工作台：浅底、低对比边框、蓝色信息态与黄色行动态。 */
    .top{box-shadow:0 1px 0 rgba(224,226,228,.5)}.library-head,.panel-bar{background:#FFF}.library-section h3{letter-spacing:.15px}.component-card{box-shadow:none}.component-card:hover{box-shadow:0 5px 15px rgba(39,104,255,.07)}.preview-side{background-color:#F9FAFE}.button.primary{box-shadow:0 2px 6px rgba(255,186,50,.2)}
    /* 工作台固定在可视区：左侧组件库、中间原稿独立滚动，右侧只做固定观察。 */
    html,body{height:100%;overflow:hidden}.layout{overflow:hidden}.library,.editor-side,.preview-side{min-height:0;overflow:hidden}.library,.editor{overscroll-behavior:contain}.library{overflow-y:auto}.editor{overflow-y:auto}
    /* 右侧是固定的观察窗口，不随外层滚轮整体移动；仅左侧库与中间原稿可滚动 */
    .preview-body{overflow:hidden;align-items:center}.preview-body.phone-scene{align-items:flex-start}.device-mock.tablet .paper,.device-mock.desktop .paper{overflow-y:auto;overscroll-behavior:contain}.preview-body.tablet-scene,.preview-body.desktop-scene{display:block}.preview-body.tablet-scene .device-mock,.preview-body.desktop-scene .device-mock{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin:0}
    /* 手机：恢复真实设备框素材，框外和屏幕区域均为透明，正文位于其下 */
    .device-mock.phone .device-ui{display:none!important}
    /* 小灵组件在编辑区与设备预览共用结构，避免头像与文字拆散。 */
    .render .component{margin:20px 0;padding:16px;border:1px solid #E0E2E4;border-radius:8px;background:#FFF}.render .component.xiaoling-note{display:flex;gap:12px;align-items:flex-start;background:#F5F8FF;border-color:#C9D8FF}.render .xiaoling-avatar-slot{flex:0 0 76px;width:76px;height:76px;border:1px dashed #8FAEFF;border-radius:10px;background:#FFF;overflow:hidden}.render .xiaoling-avatar-slot img{display:block;width:100%;height:100%;margin:0;object-fit:contain;border-radius:0}.render .xiaoling-note-copy{min-width:0;flex:1}.render .component .label{margin-bottom:7px;color:#2768FF;font-size:10px;font-weight:700;letter-spacing:1px}.render .component.xiaoling-note p{margin:0;color:#666;font-size:13px;line-height:1.8}.render .component.xiaoling-note h3{margin:0 0 7px;border:0;padding:0}
    .device-mock.phone{padding:0;background:transparent;box-shadow:none;border-radius:0;overflow:visible}
    .device-mock.phone:before{display:block;top:2.1%;width:23%;height:1.55%;background:#050506;border-radius:14px;z-index:4}
    .device-mock.phone .paper{position:absolute;inset:2.25% 2.3% 2.15%;width:auto;height:auto;padding:28px 24px 36px;overflow:auto;border:0;border-radius:10% 10% 8% 8%;box-shadow:none}
    .device-mock.phone .device-frame{display:block!important;position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;content:url('assets/preview/iphone-frame-cutout.png')}
    /* 工具栏按编辑任务线性排列，去掉分散的两端对齐 */
    
    @media(max-width:1080px){}
    /* 视觉交互：将资源、创作、设备预览三个区域做成清晰但克制的工作台层级。 */
    .top,.library,.editor-side,.preview-side,.component-card,.tab,.small-button,.button,.device-mock{transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}.library{background:linear-gradient(180deg,#FFF 0%,#FBFCFF 100%);border-right:1px solid #DCE2EC;box-shadow:8px 0 18px rgba(38,51,76,.025)}.library-head{padding-top:20px}.library-head:after{content:"资源库";display:inline-block;margin-top:7px;padding:3px 6px;border-radius:4px;background:rgba(39,104,255,.08);color:#2768FF;font-size:10px;font-weight:700}.tabs{gap:18px;background:#FFF;border-bottom:1px solid #E8ECF2}.tab{padding-bottom:11px}.tab:hover{color:#2768FF}.library-panel{padding-top:14px}.library-view-head{background:linear-gradient(90deg,#F4F7FF,#F9FAFE);border-color:#E3E9FA}.component-card{border-color:#E5E8EF}.component-card:hover{transform:translateY(-1px)}.component-icon{box-shadow:inset 0 0 0 1px rgba(39,104,255,.04)}.editor-side{background:#FFF;border-right:1px solid #DCE2EC;box-shadow:8px 0 18px rgba(38,51,76,.02)}.editor-side .panel-bar{border-top:3px solid #2768FF;border-bottom-color:#E8ECF2}.editor-side .panel-bar strong:after{content:"创作区";display:inline-block;margin-left:8px;padding:3px 6px;border-radius:4px;background:rgba(39,104,255,.08);color:#2768FF;font-size:10px;vertical-align:1px}.panel-bar{background:rgba(255,255,255,.96)}.small-button:active,.button:active{transform:translateY(1px)}.preview-side{background-image:radial-gradient(rgba(39,104,255,.10) 1px,transparent 1px);background-size:16px 16px}.preview-side .panel-bar{border-top:3px solid #FFBA32;background:rgba(249,250,254,.95);border-bottom-color:#DCE4F0}.preview-side .panel-bar strong:after{content:"设备预览";display:inline-block;margin-left:8px;padding:3px 6px;border-radius:4px;background:rgba(255,186,50,.13);color:#9A6400;font-size:10px;vertical-align:1px}.preview-body.tablet-scene,.preview-body.desktop-scene{background-image:linear-gradient(145deg,#F5F7FC,#E9EEF8)}.device-mock.tablet,.device-mock.desktop{animation:device-in .28s ease both}.device-mock.device-swap{animation:device-swap .34s cubic-bezier(.2,.75,.3,1) both}@keyframes device-in{from{opacity:.3;transform:translate(-50%,-48%) scale(.985)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes device-swap{0%{opacity:.25;filter:blur(2px)}100%{opacity:1;filter:blur(0)}}
    .template-editor{width:min(650px,94vw)}.template-editor label{display:block;margin:13px 0 6px;font-size:12px;font-weight:700;color:#3C4A68}.template-editor input,.template-editor textarea{width:100%;border:1px solid #D9DDE5;border-radius:6px;padding:9px;font:13px/1.6 var(--ui-font);outline:none}.template-editor textarea{height:210px;resize:vertical;font-family:Consolas,"Microsoft YaHei",monospace}.template-editor input:focus,.template-editor textarea:focus{border-color:#2768FF;box-shadow:0 0 0 3px rgba(39,104,255,.08)}.template-rich-editor{min-height:190px;max-height:340px;overflow:auto;padding:14px;border:1px solid #D9DDE5;border-radius:6px;background:#FFF;color:#666;font:15px/1.8 var(--article-font);outline:none}.template-rich-editor:empty:before{content:"在这里直接输入模板内容；可粘贴图片和文字。";color:#A7AEBB}.template-rich-editor:focus{border-color:#2768FF;box-shadow:0 0 0 3px rgba(39,104,255,.08)}.template-rich-editor h1,.template-rich-editor h2,.template-rich-editor h3{color:#202020}.template-advanced{margin-top:10px;color:#7D8798;font-size:12px}.template-advanced summary{cursor:pointer}.template-advanced textarea{margin-top:8px}.template-editor-actions{display:flex;gap:8px;margin-top:14px}.template-editor-actions .modal-action{flex:1}.template-editor-actions .button{height:38px}.template-actions{display:flex;gap:6px;margin-top:9px}.template-actions button,.template-manage-edit{height:26px;padding:0 8px;border:1px solid #D9DDE5;border-radius:4px;background:#FFF;color:#666;font:11px var(--ui-font);cursor:pointer}.template-actions button:hover,.template-manage-edit:hover{border-color:#2768FF;color:#2768FF}.image-item .image-name{position:absolute;right:4px;bottom:4px;left:4px;overflow:hidden;padding:4px 5px;border-radius:4px;background:rgba(20,24,32,.68);color:#FFF;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.image-item .rename-image{right:28px}.image-item.gif:after{content:"GIF";position:absolute;left:4px;top:4px;padding:2px 4px;border-radius:3px;background:#2768FF;color:#FFF;font-size:9px;font-weight:700}.guide-modal{width:min(570px,92vw);padding:26px}.guide-head{padding-right:34px}.guide-kicker{display:block;margin-bottom:8px;color:#2768FF;font-size:11px;font-weight:700;letter-spacing:.7px}.guide-head h2{margin:0;color:#202020;font-size:22px}.guide-head p{margin:8px 0 0;color:#666;font-size:13px}.guide-progress{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:22px 0 18px}.guide-progress i{height:4px;border-radius:999px;background:#E7EAF0;transition:background .2s ease,transform .2s ease}.guide-progress i.active{background:#2768FF;transform:scaleY(1.25)}.guide-pages{min-height:278px}.guide-page{display:none;animation:guide-page-in .22s ease both}.guide-page.active{display:block}@keyframes guide-page-in{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}.guide-page h3{margin:17px 0 8px;color:#202020;font-size:17px}.guide-page p{margin:0;color:#666;font-size:14px;line-height:1.8}.guide-page aside{margin-top:15px;padding:10px 12px;border-left:3px solid #FFBA32;border-radius:0 6px 6px 0;background:#FFF9E8;color:#795100;font-size:12px;line-height:1.65}.guide-demo{height:94px;display:flex;align-items:center;justify-content:center;gap:9px;overflow:hidden;border:1px solid #DCE5FB;border-radius:10px;background:linear-gradient(135deg,#F3F6FF,#FBFCFF);color:#2768FF}.guide-demo>*{display:grid;place-items:center;min-height:30px;padding:0 11px;border-radius:6px;background:#FFF;box-shadow:0 3px 9px rgba(39,104,255,.08);font-size:12px}.import-demo b{background:#2768FF;color:#FFF}.structure-demo{justify-content:flex-start;padding:0 18px}.structure-demo em{display:block;width:74px;height:5px;border-radius:4px;background:#D4DCEB}.structure-demo em:last-child{width:48px}.list-demo{display:grid;grid-template-columns:32px 1fr;justify-content:start;padding:14px 34px}.list-demo b{box-shadow:none;background:transparent;color:#2768FF;padding:0}.list-demo span{justify-content:start;box-shadow:none;background:transparent;padding:0;color:#536174}.component-demo{gap:8px}.component-demo b{color:#3C4A68}.preview-demo span:first-child{border:1px solid #AEB8CC}.preview-demo span:nth-child(2){padding:10px 18px;border:2px solid #2768FF}.guide-footer{display:flex;align-items:center;gap:10px;margin-top:17px}.guide-footer span{margin:auto;color:#8992A2;font-size:12px}.guide-footer .modal-action{width:auto;min-width:86px;height:36px;padding:0 15px}.guide-footer .button{height:36px}
    /* 色板宽度与 RGBA 操作区对齐：每行十枚色块 */
    #colorPopover{min-width:327px}
    #colorPopover .color-grid{grid-template-columns:repeat(10,24px);gap:7px}
    /* 最终工作台层级：三块区域各自成卡，工具栏与正文分层，避免视觉上粘成一片。 */
    .layout{gap:12px;padding:12px;background:#EDF2F8;grid-template-columns:272px minmax(460px,1fr) minmax(410px,1fr)}
    .library,.editor-side,.preview-side{min-height:0;border:1px solid #D9E1ED!important;border-radius:12px!important;box-shadow:0 10px 26px rgba(32,48,78,.07)!important;overflow:hidden!important}
    .library{background:linear-gradient(180deg,#FFFFFF 0%,#F8FAFE 100%)!important}.library-head{background:#FFF;border-bottom:1px solid #E3E9F2}.tabs{background:#FBFCFF}.library-panel{background:linear-gradient(180deg,#FBFCFF 0%,#F5F8FD 100%);padding-bottom:26px}
    .editor-side{background:#FFF!important}.editor-side .panel-bar{background:linear-gradient(90deg,#FFFFFF,#F7FAFF);border-top:4px solid #2768FF!important}.editor{background:#FFF}.editor-foot{border-top:1px solid #E3E9F2;background:#FBFCFE}
    .preview-side{background-color:#F4F7FB!important}.preview-side .panel-bar{background:linear-gradient(90deg,#FFFFFF,#FFFDF7);border-top:4px solid #FFBA32!important}.preview-body{border-top:1px solid #D9E3EF}
    /* 电脑预览是有屏幕、边框与底座的深色设备，而非一张浮在背景上的浏览器卡片。 */
    .device-mock.desktop{width:min(90%,900px)!important;height:min(61vw,620px)!important;min-height:440px!important;padding:0!important;background:linear-gradient(145deg,#353941 0%,#121417 45%,#282C33 100%)!important;border:6px solid #101216!important;border-radius:20px!important;box-shadow:0 28px 52px rgba(12,19,32,.34),inset 0 0 0 1px rgba(255,255,255,.13)!important;overflow:visible!important}
    .device-mock.desktop:before{top:7px!important;width:78px!important;height:7px!important;background:#08090B!important;border-radius:0 0 7px 7px!important;box-shadow:inset 0 1px rgba(255,255,255,.08)}
    .device-mock.desktop:after{bottom:-42px!important;width:170px!important;height:36px!important;background:linear-gradient(90deg,#111317,#444A54 50%,#111317)!important;border:1px solid #0A0B0D!important;border-radius:0 0 18px 18px!important;box-shadow:0 11px 18px rgba(10,13,20,.24)!important}
    .device-mock.desktop .browser-chrome{position:absolute!important;top:10px!important;right:10px!important;left:10px!important;z-index:2;height:38px!important;border:1px solid #1E2229!important;border-bottom-color:#343943!important;border-radius:9px 9px 0 0!important;background:linear-gradient(180deg,#343941,#272B31)!important;color:#C9D0DA!important}
    .device-mock.desktop .browser-tab{height:24px!important;border-color:#4A515C!important;background:#22262C!important;color:#E7EAF0!important}.device-mock.desktop .browser-address{height:24px!important;background:#1A1D22!important;color:#9299A6!important}.device-mock.desktop .browser-ai{background:#292E36!important;border-color:#4A515C!important;color:#DCE2EB!important}
    .device-mock.desktop .paper{position:absolute!important;top:48px!important;right:10px!important;bottom:10px!important;left:10px!important;width:auto!important;height:auto!important;min-height:0!important;margin:0!important;padding:39px clamp(30px,7vw,100px) 68px!important;border:0!important;border-radius:0 0 8px 8px!important;background:#FFF!important;overflow-y:auto!important;box-shadow:none!important}
    .device-mock.device-dark.desktop .paper{background:#191A1C!important}.device-mock.device-dark.desktop .browser-chrome{background:linear-gradient(180deg,#272B31,#1D2025)!important}
    /* 教程使用同一套工作台语言：每页都在模拟真实界面，并明确可点击/可滚动的位置。 */
    .guide-modal{width:min(720px,94vw)!important;padding:28px!important;border:1px solid #D9E2F0!important;background:linear-gradient(180deg,#FFF,#F8FAFE)!important}.guide-pages{min-height:336px!important;transition:opacity .14s ease}.guide-page h3{font-size:18px!important}.guide-page p{font-size:13px!important}.guide-workbench{display:grid;grid-template-columns:.85fr 1.35fr 1fr;gap:7px;min-height:146px;padding:9px;border:1px solid #D7E1F1;border-radius:12px;background:linear-gradient(145deg,#EFF4FB,#E2EAF5);overflow:hidden}.guide-zone{position:relative;min-width:0;overflow:hidden;border:1px solid #D5DFED;border-radius:8px;background:#FFF;box-shadow:0 3px 9px rgba(29,50,84,.06)}.guide-zone header{display:flex;align-items:center;gap:5px;height:24px;padding:0 7px;border-bottom:1px solid #E5EBF4;color:#506078;font-size:9px;font-weight:700}.guide-zone header i{display:grid;place-items:center;width:13px;height:13px;border-radius:50%;background:#2768FF;color:#FFF;font-style:normal;font-size:8px}.guide-library-mini header{border-top:3px solid #2768FF}.guide-editor-mini header{border-top:3px solid #2768FF}.guide-preview-mini header{border-top:3px solid #FFBA32}.guide-mini-tabs{display:flex;gap:5px;padding:6px 6px 4px;color:#7D8798;font-size:8px}.guide-mini-tabs b{color:#2768FF}.guide-mini-card{display:block;height:23px;margin:4px 6px;border:1px solid #E0E7F0;border-radius:4px;background:#F8FAFE}.guide-mini-card:before{content:"";display:block;width:55%;height:4px;margin:6px;background:#AFC3F7;border-radius:4px}.guide-mini-toolbar{display:flex;gap:4px;padding:6px;border-bottom:1px solid #DCE5F1;background:#F3F6FB}.guide-mini-toolbar i{width:17px;height:13px;border:1px solid #CBD7E7;border-radius:3px;background:#FFF}.guide-mini-copy{padding:10px 9px;color:#8D96A4;font-size:8px;line-height:1.8}.guide-mini-copy b{display:block;width:78%;height:7px;margin-bottom:9px;background:#273248;border-radius:3px}.guide-mini-copy em{display:block;width:100%;height:4px;margin:6px 0;background:#D9E0E9;border-radius:3px}.guide-mini-device{position:absolute;inset:36px 16px 9px;border:3px solid #16191E;border-radius:7px;background:#2B2F35;padding:4px}.guide-mini-device:after{content:"";position:absolute;bottom:-7px;left:50%;width:28px;height:6px;transform:translateX(-50%);border-radius:0 0 5px 5px;background:#171A1E}.guide-mini-device i{display:block;height:100%;background:#FFF}.guide-hotspot{position:absolute;z-index:3;display:grid;place-items:center;width:20px;height:20px;border:2px solid #FFF;border-radius:50%;background:#2768FF;color:#FFF;font-size:10px;font-weight:700;box-shadow:0 2px 8px rgba(39,104,255,.35);animation:guide-pulse 1.8s infinite}.guide-preview-mini .guide-hotspot{background:#E49B00}.guide-zone .guide-hotspot{right:6px;top:5px}@keyframes guide-pulse{50%{box-shadow:0 0 0 5px rgba(39,104,255,.12)}}.guide-detail{display:grid;grid-template-columns:1.05fr .95fr;gap:10px;min-height:150px;padding:10px;border:1px solid #D7E1F1;border-radius:12px;background:#F0F4FA}.guide-detail-card{position:relative;overflow:hidden;border:1px solid #D9E2EF;border-radius:8px;background:#FFF;box-shadow:0 3px 9px rgba(29,50,84,.06)}.guide-detail-card header{display:flex;align-items:center;gap:7px;height:31px;padding:0 9px;border-bottom:1px solid #E7ECF3;color:#35445D;font-size:10px;font-weight:700}.guide-detail-card header span{padding:3px 5px;border-radius:3px;background:#EAF0FF;color:#2768FF}.guide-scroll-track{position:absolute;top:42px;right:5px;bottom:7px;width:4px;border-radius:4px;background:#EEF2F7}.guide-scroll-track i{display:block;width:4px;height:38px;margin-top:12px;border-radius:4px;background:#9BAAC0}.guide-library-list{padding:7px}.guide-library-list b{display:block;height:22px;margin:5px 0;padding:5px 7px;border:1px solid #E1E7F0;border-radius:4px;color:#647187;font-size:8px}.guide-editor-detail .guide-mini-toolbar{padding:7px}.guide-editor-detail .guide-mini-copy{font-size:9px}.guide-editor-detail .guide-hotspot{right:9px;top:7px}.guide-device-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:150px;border:1px solid #D7E1F1;border-radius:12px;background:linear-gradient(145deg,#E9EEF6,#D7E0ED)}.guide-device-switch{position:absolute;top:8px;left:8px;display:flex;gap:4px}.guide-device-switch b{padding:3px 5px;border:1px solid #D1DAE7;border-radius:4px;background:#FFF;color:#7B879A;font-size:8px}.guide-device-switch b:last-child{border-color:#2768FF;background:#EFF4FF;color:#2768FF}.guide-guide-desktop{position:relative;width:66%;height:94px;margin-top:18px;border:4px solid #15181D;border-radius:9px;background:#2B3037;box-shadow:0 9px 16px rgba(23,35,55,.22)}.guide-guide-desktop:after{content:"";position:absolute;bottom:-12px;left:50%;width:34px;height:9px;transform:translateX(-50%);border-radius:0 0 5px 5px;background:#22262C}.guide-guide-desktop i{position:absolute;top:6px;right:6px;bottom:6px;left:6px;background:#FFF}.guide-guide-desktop i:before{content:"灵心平台 · 文章预览";display:block;padding:6px 8px;border-bottom:1px solid #E6EAF0;color:#8A94A2;font-size:7px}.guide-checklist{display:grid;grid-template-columns:1fr 1fr;gap:10px;min-height:150px;padding:10px;border:1px solid #D7E1F1;border-radius:12px;background:#F0F4FA}.guide-checklist section{padding:11px;border:1px solid #D9E2EF;border-radius:8px;background:#FFF}.guide-checklist b{display:block;margin-bottom:8px;color:#293750;font-size:11px}.guide-checklist span{display:block;margin:6px 0;color:#67758B;font-size:10px}.guide-checklist span:before{content:"✓";display:inline-grid;place-items:center;width:13px;height:13px;margin-right:5px;border-radius:50%;background:#EAF0FF;color:#2768FF;font-size:8px}.guide-checklist .guide-copy-action{display:grid;place-items:center;background:linear-gradient(145deg,#FFF7E5,#FFF);color:#805100;text-align:center}.guide-copy-action strong{display:block;margin-bottom:7px;font-size:12px}.guide-copy-action em{padding:7px 9px;border-radius:5px;background:#FFBA32;color:#202020;font-size:10px;font-style:normal;font-weight:700}
    @media(max-width:760px){.layout{padding:0;gap:0}.library,.editor-side,.preview-side{border-radius:0!important}.guide-workbench{grid-template-columns:1fr 1.2fr 1fr}.guide-modal{padding:20px!important}.guide-detail,.guide-checklist{grid-template-columns:1fr}.guide-pages{min-height:390px!important}.device-mock.desktop{width:92%!important}}
    /* 灵心工作台化：轻渐变顶栏、黄色当前态、圆角资源卡片。 */
    .top{height:76px;padding:0 26px;background:linear-gradient(108deg,#F1F2FF 0%,#F7F5FF 44%,#FFF8ED 100%);border-top:0!important;border-bottom:1px solid rgba(224,226,228,.75)!important;box-shadow:0 4px 18px rgba(47,62,97,.05)}.brand{gap:12px}.brand img{width:154px}.brand span{font-weight:700;color:#647086}.workspace-nav{display:flex;align-items:stretch;gap:42px;height:100%;margin-left:78px}.workspace-nav a{position:relative;display:grid;place-items:center;min-width:72px;color:#8B93A2;font-size:15px;font-weight:700;cursor:pointer;transition:color .2s ease}.workspace-nav a.active{color:#202020}.workspace-nav a.active:after{content:"";position:absolute;bottom:12px;width:22px;height:4px;border-radius:999px;background:#FFBA32;box-shadow:0 2px 5px rgba(255,186,50,.28)}.workspace-nav a:hover{color:#2768FF}.top-actions{margin-left:auto}.status{padding:6px 9px;border-radius:999px;background:rgba(50,206,58,.10);color:#299436!important}
    /* 三类资源使用不同的产品态，不只更换文字。 */
    .tabs{gap:8px;padding:10px 12px 8px!important;background:linear-gradient(180deg,#FFF,#F8FAFE)!important}.tab{flex:1;padding:9px 4px!important;border:1px solid transparent!important;border-radius:8px!important;background:transparent!important;white-space:nowrap}.tab:after{display:none!important}.tab.active{border-color:#DCE6F7!important;background:#EEF4FF!important;color:#2768FF!important;box-shadow:0 3px 9px rgba(39,104,255,.07)}.tab[data-tab="images"].active{border-color:#D8EBDE!important;background:#EFFAF1!important;color:#218C4A!important}.tab[data-tab="templates"].active{border-color:#F3E1BB!important;background:#FFF8E8!important;color:#9A6400!important}.library-panel{position:relative}.library-panel:before{display:block;margin:0 0 13px;padding:8px 10px;border-radius:8px;font-size:11px;font-weight:700;letter-spacing:.2px}.library-panel#componentsPanel:before{content:"组件库 · 选择一个内容块插入原稿";border-left:3px solid #2768FF;background:#EEF4FF;color:#2768FF}.library-panel#imagesPanel:before{content:"图片收藏 · 上传、命名并重复使用";border-left:3px solid #32A85B;background:#EFFAF1;color:#218C4A}.library-panel#templatesPanel:before{content:"全文模板 · 沉淀成熟文章结构";border-left:3px solid #FFBA32;background:#FFF8E8;color:#8D6200}.library-section{padding:11px 10px 7px;border:1px solid #E3E9F2;border-radius:10px;background:#FFF;box-shadow:0 4px 12px rgba(36,55,88,.035)}.library-section h3{padding-bottom:8px;border-bottom:1px solid #EEF1F5}.library-section:nth-of-type(2){border-color:#E3E9F7}.library-section:nth-of-type(3){border-color:#F2E5C6}.library-section#customComponents{border-color:#E5E0F7}.component-card{border-left:3px solid #2768FF!important;border-radius:9px!important;background:linear-gradient(115deg,#FFF,#FBFCFF)!important}.library-section:nth-of-type(2) .component-card{border-left-color:#7A22F6!important}.library-section:nth-of-type(3) .component-card{border-left-color:#FFBA32!important}.image-collection{padding-top:5px}.image-item{border-radius:10px!important;box-shadow:0 4px 10px rgba(33,81,61,.10)}.saved-template{position:relative;border-radius:10px!important;border-left:3px solid #FFBA32!important;background:linear-gradient(115deg,#FFF,#FFFCF6)!important}.saved-template:before{content:"模板";display:inline-block;margin:0 0 7px;padding:2px 5px;border-radius:3px;background:#FFF1CD;color:#966400;font-size:9px;font-weight:700}
    /* 微信深浅色阅读模拟：仅作用于设备内内容，模拟标准阅读器的底色与文字对比。 */
    .device-mock.device-dark .paper{background:#191919!important;color:#B8B8B8!important}.device-mock.device-dark .paper .author{color:#A7A7A7!important}.device-mock.device-dark .paper .original{border-color:#5B5B5B!important;color:#A7A7A7!important}.device-mock.device-dark .render p,.device-mock.device-dark .render li{color:#B8B8B8}.device-mock.device-dark .render h1,.device-mock.device-dark .render h3{color:#E8E8E8}.device-mock.device-dark .render h2,.device-mock.device-dark .render h2 span{color:#AFC5FF}.device-mock.device-dark .render blockquote{color:#AFC5FF;border-left-color:#6D90EB}.device-mock.device-dark .render .component{background:#242424;border-color:#3D3D3D}.device-mock.device-dark .render .component .label{color:#AFC5FF}.device-mock.device-dark .render .component p{color:#C4C4C4}.device-mock.device-dark .render a{color:#8FB2FF}.device-mock.device-dark .render img{filter:brightness(.88) saturate(.9)}
    /* 模板画布使用真正可拖拽的 resize 控件；文本颜色与背景色走富文本内联样式，保存后可复用。 */
    .template-editor{width:min(760px,94vw)!important}.template-visual-tools{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:8px 0;padding:8px;border:1px solid #DDE6F1;border-radius:8px;background:#F5F8FC}.template-visual-tools button,.template-visual-tools select{height:27px;min-width:27px;border:1px solid #D3DDEA;border-radius:5px;background:#FFF;color:#3F4D63;font:700 11px var(--ui-font);cursor:pointer}.template-visual-tools button:hover,.template-visual-tools select:hover{border-color:#2768FF;color:#2768FF}.template-visual-tools select{padding:0 7px}.template-color-set{display:flex;gap:4px;padding-left:6px;border-left:1px solid #DDE5EE}.template-color-set button{width:22px;min-width:22px;padding:0;background:var(--swatch)!important}.template-color-set button[style*="FFFFFF"]{box-shadow:inset 0 0 0 1px #C9D2DF}.template-resize-tip{margin-left:auto;color:#8390A3;font-size:10px}.template-rich-editor{width:min(100%,580px);min-width:260px;min-height:190px;resize:both!important;overflow:auto!important;border:1px solid #C9D9F0!important;box-shadow:0 5px 16px rgba(39,104,255,.07)}.template-rich-editor:after{content:"";display:block;clear:both}.template-rich-editor:focus{border-color:#2768FF!important}.template-layout{max-width:100%;box-sizing:border-box}.template-layout .component{box-sizing:border-box}
    /* 教程设备页：用手机、平板、电脑三种可辨识设备，而不是抽象方块。 */
    .guide-device-stage{min-height:184px!important;padding:30px 18px 12px!important;align-items:flex-end!important;gap:11px;background:linear-gradient(145deg,#EEF3FA,#D8E2F0)!important}.guide-preview-device{position:relative;flex:0 0 auto;background:#22262C;box-shadow:0 7px 14px rgba(23,35,55,.20)}.guide-preview-device>i{position:absolute;display:block;background:#FFF;overflow:hidden}.guide-preview-device>i:before{content:"灵心平台";display:block;padding:4px 5px;border-bottom:1px solid #E5EAF1;color:#8893A3;font-size:6px}.guide-preview-phone{width:39px;height:78px;border:3px solid #14161A;border-radius:11px}.guide-preview-phone:before{content:"";position:absolute;z-index:2;top:2px;left:50%;width:14px;height:3px;transform:translateX(-50%);border-radius:4px;background:#08090B}.guide-preview-phone>i{top:5px;right:3px;bottom:3px;left:3px;border-radius:7px}.guide-preview-tablet{width:92px;height:68px;border:4px solid #181B20;border-radius:10px}.guide-preview-tablet:before{content:"";position:absolute;top:2px;left:50%;width:3px;height:3px;transform:translateX(-50%);border-radius:50%;background:#58606C}.guide-preview-tablet>i{top:4px;right:4px;bottom:4px;left:4px;border-radius:5px}.guide-preview-desktop{width:164px;height:103px;border:5px solid #111317;border-radius:12px;background:linear-gradient(145deg,#3C434E,#15171B 55%,#2A2F36)}.guide-preview-desktop:before{content:"";position:absolute;z-index:2;top:0;left:50%;width:32px;height:4px;transform:translateX(-50%);border-radius:0 0 4px 4px;background:#080A0C}.guide-preview-desktop:after{content:"";position:absolute;bottom:-13px;left:50%;width:40px;height:10px;transform:translateX(-50%);border-radius:0 0 6px 6px;background:#1A1D22}.guide-preview-desktop>i{top:7px;right:7px;bottom:7px;left:7px}.guide-preview-desktop>i:before{content:"●  ●  ●　公众号文章预览";background:#F4F6F9;color:#7E8998}.guide-device-stage .guide-hotspot{right:13px!important;top:48px!important}
    /* 插入后的组件属于当前文章。点击即定位，浮层微调只改这一份，主动保存后才成为左侧模板。 */
    .layout{height:calc(100vh - 76px)!important}.workspace-nav{display:none!important}.preview-side .panel-bar strong:after{display:none!important}.guide-button{display:inline-flex;align-items:center;gap:6px;border-color:#D7E2F3!important;background:linear-gradient(180deg,#FFF,#F5F8FE)!important;color:#2768FF!important;box-shadow:0 3px 9px rgba(39,104,255,.07)}.guide-button i{display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#2768FF;color:#FFF;font-size:11px;font-style:normal}.editor .component.component-selected{position:relative;outline:2px solid #2768FF;outline-offset:3px;box-shadow:0 0 0 5px rgba(39,104,255,.10);resize:both;overflow:auto;max-width:100%;min-width:180px;min-height:64px;cursor:text}.editor .component.component-selected:after{content:"当前组件 · 拖拽右下角调整尺寸";position:absolute;right:7px;top:-24px;padding:2px 6px;border-radius:4px;background:#2768FF;color:#FFF;font:10px var(--ui-font);white-space:nowrap;pointer-events:none}.component-inspector{position:fixed;z-index:29;display:none;width:332px;padding:10px;border:1px solid #C9D9F0;border-radius:10px;background:rgba(255,255,255,.98);box-shadow:0 15px 38px rgba(27,48,83,.20);backdrop-filter:blur(10px)}.component-inspector.open{display:block;animation:inspector-in .16s ease both}@keyframes inspector-in{from{opacity:0;transform:translateY(5px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.component-inspector header{display:flex;align-items:center;gap:7px;margin:0 0 9px;padding-bottom:8px;border-bottom:1px solid #E5EBF3}.component-inspector header span{font-size:12px;font-weight:700;color:#273750}.component-inspector header small{padding:2px 5px;border-radius:3px;background:#FFF2CE;color:#896000;font-size:9px}.component-inspector header button{margin-left:auto;width:22px;height:22px;border:0;border-radius:5px;background:#F1F4F8;color:#7C8798;cursor:pointer}.component-inspector-row{display:flex;align-items:center;gap:6px;margin:7px 0;color:#5C6A7D;font-size:11px}.component-inspector-row>b{font-size:10px;color:#778499}.component-inspector-row button[data-component-text],.component-inspector-row button[data-component-bg]{width:20px;height:20px;padding:0;border:1px solid #D0DAE7;border-radius:5px;background:var(--inspector);cursor:pointer}.component-inspector-row button[style*="FFFFFF"]{box-shadow:inset 0 0 0 1px #C9D2DF}.inspector-divider{width:1px;height:18px;margin:0 2px;background:#DFE5EE}.component-inspector-row label{display:flex;align-items:center;gap:5px;font-size:10px;color:#778499}.component-inspector-row select{height:25px;border:1px solid #D3DDEA;border-radius:5px;background:#FFF;color:#3E4C60;font-size:10px}.component-inspector-row input[type="range"]{width:78px;accent-color:#2768FF}.inspector-resize{margin-left:auto;color:#8995A5;font-size:9px;white-space:nowrap}.component-inspector footer{display:flex;justify-content:space-between;gap:7px;margin-top:10px;padding-top:9px;border-top:1px solid #E5EBF3}.component-inspector footer button{height:29px;padding:0 9px;border-radius:5px;font:700 11px var(--ui-font);cursor:pointer}.inspector-reset{border:1px solid #D6DFEA;background:#FFF;color:#68768A}.inspector-save{border:1px solid #FFBA32;background:#FFBA32;color:#202020}
    /* 图片是素材资产，不参与内容模板切换；固定在资源库底部，随时可插入当前光标。 */
    .library{grid-template-rows:auto auto minmax(0,1fr) 208px!important}.image-dock{grid-row:4;display:grid;grid-template-rows:auto auto minmax(0,1fr);min-height:0;overflow:hidden;padding:10px 12px 12px;border-top:1px solid #DCE7E1;background:linear-gradient(145deg,#F4FBF6,#EFF8F3)}.image-dock-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.image-dock-head span{color:#247948;font-size:12px;font-weight:700}.image-dock-head i{display:inline-grid;place-items:center;width:19px;height:19px;margin-right:5px;border-radius:5px;background:#DDF3E4;color:#218C4A;font-style:normal}.image-dock .library-tip{margin:5px 0 7px;color:#5E8A6D;font-size:10px}.image-dock .small-button{border-color:#BBDDC6;background:#FFF;color:#218C4A}.image-dock .image-collection{height:100%;max-height:none;margin-top:0;padding-right:4px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#9DC6AA transparent}.image-dock .image-collection::-webkit-scrollbar{width:6px}.image-dock .image-collection::-webkit-scrollbar-thumb{border-radius:6px;background:#9DC6AA}.apply-template-button{margin-left:8px;border-color:#F1D695!important;background:#FFF9E9!important;color:#996500!important}.editor-side .panel-bar .save{margin-left:auto}.editor-side .panel-bar .apply-template-button{margin-left:0}
    /* 右侧手机始终按可用高度完整显示；组件库采用二级分类，避免在资源区长距离滚动。 */
    .preview-body.phone-scene{align-items:center!important;justify-content:center!important;padding:18px!important;overflow:hidden!important}.preview-body.phone-scene .device-mock.phone{width:auto!important;height:min(100%,780px)!important;max-width:100%!important;aspect-ratio:1091 / 2260!important;flex:0 0 auto}.component-subtabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 0 8px;padding:7px;border:1px solid #E0E8F3;border-radius:9px;background:#F5F8FC}.component-subtabs button{height:28px;border:1px solid transparent;border-radius:6px;background:transparent;color:#758298;font:700 10px var(--ui-font);cursor:pointer}.component-subtabs button:hover{background:#FFF;color:#2768FF}.component-subtabs button.active{border-color:#D5E3FF;background:#FFF;color:#2768FF;box-shadow:0 2px 6px rgba(39,104,255,.09)}.library-section.component-section-hidden{display:none!important}.component-text-hint{display:flex;gap:8px;align-items:flex-start;margin:0 0 8px;padding:8px 9px;border:1px solid #D8E5FA;border-radius:7px;background:#F3F7FF;color:#61718A;font-size:10px;line-height:1.55}.component-text-hint b{flex:0 0 auto;color:#2768FF;font-size:10px}.component-inspector{width:348px!important}.component-inspector-row{margin:8px 0!important}.component-inspector .inspector-resize{margin-left:auto}
    /* 图片素材坞改为中性蓝灰；模板页进入统一暖黄色状态，两个内容区均独立可滚动。 */
    .image-dock{margin:10px!important;border:1px solid #C7D5E7!important;border-top:4px solid #8EADD3!important;border-radius:11px!important;background:linear-gradient(145deg,#FAFCFF,#EEF3FA)!important;box-shadow:0 7px 17px rgba(35,61,98,.08),inset 0 1px rgba(255,255,255,.9)}.image-dock-head span{color:#3E5D88!important}.image-dock-head i{background:#E2ECFA!important;color:#2768FF!important}.image-dock .library-tip{color:#71809A!important}.image-dock .small-button{border-color:#C9D9EE!important;color:#2768FF!important}.image-dock .image-collection{border-top:1px solid #DCE5F1;padding-top:8px;scrollbar-color:#A8BAD2 transparent}.image-dock .image-collection::-webkit-scrollbar-thumb{background:#A8BAD2!important}.library.templates-view{background:linear-gradient(180deg,#FFFDF8,#FFF9EC)!important}.library.templates-view .library-head{background:linear-gradient(90deg,#FFFDF8,#FFF8E6)!important;border-bottom-color:#F2E2BC!important}.library.templates-view .library-head:after{background:rgba(255,186,50,.16)!important;color:#956100!important}.library.templates-view .tabs{background:#FFF9ED!important;border-bottom-color:#F1E1BD!important}.library.templates-view .tab.active{border-color:#F0D58E!important;background:#FFF3D5!important;color:#956100!important}.library.templates-view #templatesPanel{background:linear-gradient(180deg,#FFFDF8,#FFF9EE)!important}.library.templates-view .library-view-head{border-color:#F1DFC0!important;background:linear-gradient(90deg,#FFF5DD,#FFFDF9)!important}.library.templates-view .library-panel{scrollbar-color:#D9B86D transparent}.library.templates-view .library-panel::-webkit-scrollbar-thumb{border-color:#FFF9EE!important;background:#D9B86D!important}.library.templates-view .image-dock{background:linear-gradient(145deg,#FAFCFF,#EEF3FA)!important}.preview-side.dark{background-color:#F4F7FB!important;background-image:radial-gradient(rgba(39,104,255,.10) 1px,transparent 1px)!important;background-size:16px 16px!important}.preview-side.dark .preview-body:before{background:linear-gradient(rgba(249,250,254,.86),rgba(249,250,254,.94))!important}.preview-side.dark .preview-body.tablet-scene:before,.preview-side.dark .preview-body.desktop-scene:before{background:rgba(247,249,253,.36)!important}
    /* 手机设备在右侧画布中完整呈现，设备内滚动条收敛为细小浮层，并同步深浅色。 */
    .preview-body.phone-scene{padding:10px 12px!important;background:linear-gradient(145deg,#F2F5FB,#E8EEF8)!important}.preview-body.phone-scene .device-mock.phone{height:calc(100% - 4px)!important;max-height:780px!important}.device-mock.phone .paper{inset:2.15% 2.18% 2.1%!important;border-radius:10% 10% 8% 8%!important;scrollbar-width:thin;scrollbar-color:rgba(112,125,145,.32) transparent}.device-mock.phone .paper::-webkit-scrollbar{width:3px}.device-mock.phone .paper::-webkit-scrollbar-track{background:transparent}.device-mock.phone .paper::-webkit-scrollbar-thumb{border-radius:999px;background:rgba(112,125,145,.32)}.device-mock.device-dark.phone .paper{scrollbar-color:rgba(196,204,216,.38) transparent}.device-mock.device-dark.phone .paper::-webkit-scrollbar-thumb{background:rgba(196,204,216,.38)}.component-style-modes{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 0 10px}.component-style-modes button{height:29px;border:1px solid #D9E2EE;border-radius:6px;background:#FFF;color:#718097;font:700 11px var(--ui-font);cursor:pointer}.component-style-modes button.active{border-color:#2768FF;background:#EFF4FF;color:#2768FF}.component-style-modes button:hover{border-color:#2768FF;color:#2768FF}
    /* V2.6：手机以透明真机框承载阅读页；外框不再和屏幕做两层圆角，滚动轨道也不进入视觉。 */
    .preview-body.phone-scene{display:grid!important;place-items:center!important;min-height:0!important;padding:14px 18px!important;overflow:hidden!important;background:linear-gradient(145deg,#F4F7FC 0%,#E7EDF7 100%)!important}
    .preview-body.phone-scene .device-mock.phone{position:relative!important;width:auto!important;height:min(100%,780px)!important;max-width:100%!important;max-height:100%!important;aspect-ratio:1091 / 2260!important;padding:0!important;background:transparent!important;border-radius:0!important;box-shadow:0 20px 38px rgba(26,39,62,.20)!important}
    .device-mock.phone:before{display:none!important}
    /* 组件分类：收紧菜单到内容的节奏，并用同一色系连接二级菜单与下方组件卡。 */
    #componentsPanel .component-subtabs{gap:7px!important;margin:0 0 6px!important;padding:7px!important;border-color:#DDE6F3!important;border-radius:11px!important;background:linear-gradient(145deg,#F7F9FD,#F3F6FB)!important}
    #componentsPanel .component-subtabs button{position:relative;height:34px!important;padding:0 8px!important;border-radius:7px!important;color:#66758C!important;font-size:12px!important;letter-spacing:0!important;transition:background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease!important}
    #componentsPanel .component-subtabs button:before{content:"";display:inline-block;width:5px;height:5px;margin:0 5px 1px 0;border-radius:50%;background:currentColor;vertical-align:middle;opacity:.55}
    #componentsPanel .component-subtabs button[data-component-section-tab="basic"].active{border-color:#C9D9FF!important;background:#FFF!important;color:#2768FF!important;box-shadow:inset 3px 0 #2768FF,0 3px 9px rgba(39,104,255,.08)!important}
    #componentsPanel .component-subtabs button[data-component-section-tab="layout"].active{border-color:#E1D2FF!important;background:#FFF!important;color:#7A22F6!important;box-shadow:inset 3px 0 #7A22F6,0 3px 9px rgba(122,34,246,.08)!important}
    #componentsPanel .component-subtabs button[data-component-section-tab="action"].active{border-color:#F5DEB5!important;background:#FFF!important;color:#A96F00!important;box-shadow:inset 3px 0 #FFBA32,0 3px 9px rgba(255,186,50,.10)!important}
    #componentsPanel .component-subtabs button[data-component-section-tab="custom"].active{border-color:#D5DBF4!important;background:#FFF!important;color:#5C67B8!important;box-shadow:inset 3px 0 #5C67B8,0 3px 9px rgba(92,103,184,.08)!important}
    #componentsPanel .library-section{margin:0!important;padding:10px 10px 7px!important}
    #componentsPanel .library-section[data-component-section="basic"]{border-color:#DDE7FB!important}#componentsPanel .library-section[data-component-section="basic"] h3:before,#componentsPanel .library-section[data-component-section="basic"] .component-card{border-left-color:#2768FF!important}
    #componentsPanel .library-section[data-component-section="layout"]{border-color:#E9DFFC!important}#componentsPanel .library-section[data-component-section="layout"] h3:before,#componentsPanel .library-section[data-component-section="layout"] .component-card{border-left-color:#7A22F6!important}
    #componentsPanel .library-section[data-component-section="action"]{border-color:#F5E5C7!important}#componentsPanel .library-section[data-component-section="action"] h3:before,#componentsPanel .library-section[data-component-section="action"] .component-card{border-left-color:#FFBA32!important}
    #componentsPanel .library-section[data-component-section="custom"]{border-color:#E0E3F4!important}#componentsPanel .library-section[data-component-section="custom"] h3:before,#componentsPanel .library-section[data-component-section="custom"] .component-card{border-left-color:#5C67B8!important}
    #componentsPanel .library-section[data-component-section="basic"] h3:before{background:#2768FF!important}#componentsPanel .library-section[data-component-section="layout"] h3:before{background:#7A22F6!important}#componentsPanel .library-section[data-component-section="action"] h3:before{background:#FFBA32!important}#componentsPanel .library-section[data-component-section="custom"] h3:before{background:#5C67B8!important}
    /* 一图一文：为产品截图、场景图和结论说明提供可读的图文节奏。 */
    .component-card[data-component="imageText"] .component-icon{background:#F3EDFF!important;color:#7A22F6!important}
    /* 小灵形象始终被约束在注释卡片内，编辑态与设备预览使用同一裁切边界。 */
    .editor .component.xiaoling-note,.render .component.xiaoling-note{overflow:hidden}
    .image-text{background:#FBFCFF!important;border-color:#E1E5F3!important}.image-text-row{display:flex;align-items:stretch;gap:13px}.image-text-media{flex:0 0 42%;min-width:0;display:flex}.image-text-media .image-slot,.image-text-media img{width:100%;height:100%!important;min-height:132px;object-fit:cover;margin:0!important;border-radius:7px}.image-text-copy{flex:1;min-width:0;align-self:center}.image-text-copy h3{margin:0 0 7px!important}.image-text-copy p{margin:0!important}.image-text-stack .image-text-media{display:block;margin:0 0 12px}.image-text-stack .image-text-media .image-slot{height:178px!important;min-height:0}.image-text-stack .image-text-copy{padding:0 3px}.image-text-keypoint{display:flex;align-items:center;gap:12px}.image-text-keypoint .image-text-media{flex-basis:48%}.image-text-keypoint .image-text-copy{padding:8px 0}.image-text-keypoint .keypoint-number{display:block;margin-bottom:6px;color:#7A22F6;font-size:11px;font-weight:800;letter-spacing:.8px}.render .image-text-row{display:flex;gap:13px}.render .image-text-media .image-slot{height:132px;min-height:132px}.render .image-text-stack .image-text-media .image-slot{height:178px;min-height:0}.render .image-text-copy h3{margin:0 0 7px}.render .image-text-copy p{margin:0}.render .image-text-keypoint .keypoint-number{display:block;margin-bottom:6px;color:#7A22F6;font-size:11px;font-weight:800;letter-spacing:.8px}
    /* 自由拼图：编辑器内允许逐图自由定位；发布时转换成一张高清公众号安全图片。 */
    .free-collage-stage{position:relative;width:100%;aspect-ratio:4/3;margin:10px 0;border:1px solid #D8E2F2;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,#F8FAFE,#EFF4FB);touch-action:none}.collage-item{position:absolute;margin:0;overflow:hidden;border:1px solid rgba(255,255,255,.94);border-radius:7px;background:#E6ECF6;box-shadow:0 3px 10px rgba(34,54,86,.16);cursor:move;touch-action:none;user-select:none}.editor .collage-item.collage-active{outline:2px solid #2768FF;outline-offset:2px}.collage-item img,.collage-item .image-slot{display:block;width:100%;height:100%;margin:0;border:0!important;border-radius:0!important;object-fit:cover}.collage-item .image-slot{background:linear-gradient(135deg,#E9EFF9,#DCE7F5);color:#71809A}.collage-item .image-caption{display:none!important}.collage-resize-handle{position:absolute;right:3px;bottom:3px;width:12px;height:12px;border-right:2px solid #FFF;border-bottom:2px solid #FFF;filter:drop-shadow(0 1px 1px rgba(0,0,0,.45));cursor:nwse-resize;z-index:2}.free-collage-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0 0}.free-collage-toolbar button{padding:5px 8px!important;border:1px solid #D8E2F2!important;border-radius:5px!important;background:#FFF!important;color:#4D668B!important;font-size:11px!important;font-weight:600!important}.free-collage-toolbar button.primary{border-color:#2768FF!important;background:#2768FF!important;color:#FFF!important}.free-collage-tip{width:100%;margin:2px 0 0!important;color:#8793A4!important;font-size:10px!important;line-height:1.55!important}.collage-caption-list{margin:8px 0 0}.collage-caption-list p{margin:3px 0!important;color:#8A94A2!important;font-size:11px!important;line-height:1.55!important;text-align:left!important}.collage-caption-list b{color:#66758C}.render [data-collage-editor-only]{display:none}
    .device-mock.phone .paper{inset:2.22% 2.28% 2.14%!important;width:auto!important;height:auto!important;margin:0!important;padding:28px 24px 38px!important;border:0!important;border-radius:10.6% 10.6% 9.2% 9.2%!important;box-shadow:none!important;scrollbar-width:none!important;-ms-overflow-style:none!important}
    .device-mock.phone .paper::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
    .device-mock.phone .device-frame{display:block!important;inset:0!important;width:100%!important;height:100%!important;z-index:4!important;filter:none!important}
    .device-mock.device-dark.phone .paper{background:#191919!important;scrollbar-color:transparent transparent!important}
    /* 组件的实例视觉统一由顶部工具栏承接；浮层只负责结构级微调。 */
    
    
    .component-inspector .component-text-hint{margin-bottom:10px!important;background:#F6F9FD!important;border-color:#DCE6F3!important;color:#63748A!important}.component-inspector .component-text-hint b{color:#2768FF!important}
    .component-inspector-row button[data-component-bg],.component-inspector-row button[data-component-text]{display:none!important}
    /* 上半部分是可复用内容，下半部分是可插入素材：通过留白、分隔线和独立容器建立层级。 */
    .library-panel{border-bottom:1px solid #DDE6F1!important;box-shadow:inset 0 -8px 12px -14px rgba(40,60,95,.42)}
    .image-dock{position:relative!important;margin:12px 10px 10px!important;border:1px solid #C6D5E8!important;border-top:4px solid #7394C1!important;border-radius:12px!important;background:linear-gradient(145deg,#FCFDFF 0%,#EDF3FA 100%)!important;box-shadow:0 10px 22px rgba(35,61,98,.10),inset 0 1px rgba(255,255,255,.95)!important}
    .image-dock:before{content:"素材坞";position:absolute;top:-10px;left:13px;padding:2px 7px;border:1px solid #D3DFEE;border-radius:999px;background:#F5F8FC;color:#647A99;font-size:9px;font-weight:700;letter-spacing:.5px}
    .image-dock-head{padding-top:2px!important}.image-dock-head span{font-size:13px!important;color:#36567F!important}.image-dock .library-tip{padding:0 0 7px!important;border-bottom:1px dashed #CBD9EA!important}.image-dock .image-collection{padding-top:10px!important}.image-dock .image-collection::-webkit-scrollbar{width:5px!important}
    /* V2.7：模板只切换交互状态；资源库底色始终保持同一工作台语境。 */
    .library.templates-view{background:linear-gradient(180deg,#FFFFFF 0%,#F8FAFE 100%)!important}
    .library.templates-view .library-head{background:#FFF!important;border-bottom-color:#E3E9F2!important}
    .library.templates-view .library-head:after{background:rgba(39,104,255,.08)!important;color:#2768FF!important}
    .library.templates-view .tabs{background:linear-gradient(180deg,#FFF,#F8FAFE)!important;border-bottom-color:#E8ECF2!important}
    .library.templates-view #templatesPanel{background:linear-gradient(180deg,#FBFCFF 0%,#F5F8FD 100%)!important}
    .library.templates-view .library-panel{scrollbar-color:#AEB9CA transparent!important}
    .library.templates-view .library-panel::-webkit-scrollbar-thumb{border-color:#F5F8FD!important;background:#AEB9CA!important}
    .library.templates-view .tab.active{border-color:#F0D58E!important;background:#FFF8E8!important;color:#9A6400!important}
    .library.templates-view .template-zero{border-color:#F0D58E!important;background:#FBFCFF!important}
    .library.templates-view .saved-template{border-color:#F0D58E!important;background:#FFF!important}
    /* 透明真机框只保留设备轮廓；不让矩形阴影污染四角。 */
    .device-mock.phone{background:transparent!important;box-shadow:none!important;filter:drop-shadow(0 18px 27px rgba(21,33,53,.23));isolation:isolate}
    .device-mock.phone .device-frame{content:normal!important;object-fit:contain!important;background:transparent!important}
    .export-button{display:inline-flex;align-items:center;gap:5px;border-color:#C8D8EE!important;background:linear-gradient(180deg,#FFF,#F4F8FD)!important;color:#3C6092!important;box-shadow:0 3px 9px rgba(44,80,130,.07)}.export-button i{display:grid;place-items:center;width:15px;height:15px;border-radius:4px;background:#E3EDFA;color:#2768FF;font-size:13px;font-style:normal;line-height:1}.export-button:disabled{cursor:wait;opacity:.72}
    /* 图片收藏使用两列可阅读缩略图，信息区压缩到一行，更多空间留给素材本身。 */
    .library{grid-template-rows:auto auto minmax(0,1fr) 252px!important}
    .image-dock{grid-template-rows:auto auto minmax(0,1fr)!important;padding:12px!important}
    .image-dock-head{min-height:30px!important}.image-dock .library-tip{margin:3px 0 8px!important;line-height:1.45!important}
    .image-dock .image-collection{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;padding:10px 5px 3px 0!important}
    .image-dock .image-item{aspect-ratio:4 / 3!important;border:1px solid #C8D7EA!important;border-radius:9px!important;background:#E8EEF7!important;box-shadow:0 3px 8px rgba(48,73,109,.09)!important;transition:transform .16s ease,box-shadow .16s ease}
    .image-dock .image-item:hover{transform:translateY(-1px);box-shadow:0 8px 16px rgba(48,73,109,.14)!important}.image-dock .image-item img{object-fit:cover!important}
    .image-dock .image-name{right:0!important;bottom:0!important;left:0!important;padding:4px 6px!important;border-radius:0!important;background:linear-gradient(transparent,rgba(19,31,49,.78))!important;font-size:10px!important;line-height:1.35!important}
    .image-dock .image-item button{top:5px!important;width:22px!important;height:22px!important;box-shadow:0 1px 4px rgba(15,25,42,.24)}.image-dock .image-item .rename-image{right:31px!important}
    .image-dock .image-collection>.library-tip{grid-column:1 / -1;margin:9px 2px!important;padding:12px!important;border:1px dashed #B9CBE1;border-radius:8px;background:rgba(255,255,255,.52);font-size:11px!important}
    /* 组件外观统一为边框一个概念；删除易混淆的“左侧色条”入口。 */
    #componentStylePopover .component-style-modes{display:block!important;margin:0 0 9px!important}
    #componentStylePopover [data-component-decoration="stripe"]{display:none!important}
    #componentStylePopover [data-component-decoration="border"]{width:100%;cursor:default!important;pointer-events:none}
    /* 小灵头像可在当前组件内缩放、定位；实际拖拽发生在编辑浮层的预览画布。 */
    .xiaoling-avatar-slot{position:relative!important;overflow:hidden!important;touch-action:none}
    .xiaoling-avatar-slot img,.render .xiaoling-avatar-slot img{position:absolute;top:var(--avatar-y,50%);left:var(--avatar-x,50%);width:var(--avatar-scale,100%);height:auto;max-width:none;max-height:none;margin:0;transform:translate(-50%,-50%);object-fit:contain;cursor:grab}
    .avatar-adjust-modal{width:min(470px,92vw)!important}.avatar-adjust-modal h2{margin-bottom:5px!important}.avatar-adjust-modal>p{margin-top:0!important}.avatar-choice-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:15px 0}.avatar-choice{aspect-ratio:1;border:1px solid #D5E0F0;border-radius:9px;background:#F6F8FC;overflow:hidden;cursor:pointer}.avatar-choice:hover,.avatar-choice.active{border-color:#2768FF;box-shadow:0 0 0 2px rgba(39,104,255,.12)}.avatar-choice img{width:100%;height:100%;object-fit:contain}.avatar-adjust-canvas{position:relative;height:156px;margin:13px 0;border:1px dashed #AFC4E1;border-radius:10px;background:linear-gradient(135deg,#F5F8FE,#EAF0FA);overflow:hidden;touch-action:none}.avatar-adjust-canvas:before{content:"在此拖拽头像调整位置";position:absolute;right:9px;bottom:7px;color:#8190A5;font-size:10px}.avatar-adjust-canvas img{position:absolute;top:50%;left:50%;width:82px;max-width:none;transform:translate(-50%,-50%);cursor:grab;user-select:none}.avatar-adjust-canvas img.dragging{cursor:grabbing}.avatar-control{display:grid;grid-template-columns:46px 1fr 38px;gap:8px;align-items:center;margin:9px 0;color:#617187;font-size:11px}.avatar-control input{width:100%;accent-color:#2768FF}.avatar-control output{text-align:right;color:#2768FF;font-variant-numeric:tabular-nums}.avatar-actions{display:flex;gap:8px;margin-top:14px}.avatar-actions .modal-action{flex:1}.avatar-actions .button{height:38px}
    /* V2.8：预览作者位使用灵心标识；资源库与图片素材成为同级双卡片。 */
    .paper .author-logo{width:27px!important;height:27px!important;border-radius:8px!important;background:#202020 url('assets/brand/linksoul-mark.png') center / 100% 100% no-repeat!important;box-shadow:0 1px 3px rgba(22,27,36,.14)}
    .library{gap:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important;grid-template-rows:auto auto minmax(0,1fr) 278px!important}
    .library-head{position:relative;margin:0!important;border:1px solid #D8E2EE!important;border-bottom:0!important;border-radius:13px 13px 0 0!important;box-shadow:0 7px 18px rgba(32,48,78,.07)!important}
    .tabs{position:relative;margin:0!important;border-right:1px solid #D8E2EE!important;border-left:1px solid #D8E2EE!important;background:#FBFCFF!important}
    .library-panel{position:relative;margin:0!important;border:1px solid #D8E2EE!important;border-top:0!important;border-radius:0 0 13px 13px!important;box-shadow:0 10px 18px rgba(32,48,78,.07)!important}
    .library.templates-view,.library.templates-view .library-head,.library.templates-view .tabs,.library.templates-view .library-panel{background:unset!important}.library.templates-view .library-head{background:#FFF!important}.library.templates-view .tabs{background:#FBFCFF!important}.library.templates-view .library-panel{background:linear-gradient(180deg,#FBFCFF 0%,#F5F8FD 100%)!important}
    .image-dock{grid-row:4!important;align-self:stretch!important;margin:14px 0 0!important;border:1px solid #C4D4E8!important;border-top:4px solid #7394C1!important;border-radius:13px!important;background:linear-gradient(145deg,#FCFDFF,#EDF3FA)!important;box-shadow:0 10px 21px rgba(35,61,98,.10)!important}.image-dock:before{top:-11px!important;left:14px!important;background:#F5F8FC!important}.image-dock-head{padding-top:5px!important}.image-dock .image-collection{padding-bottom:7px!important}
    /* 组件浮层只承担撤销与沉淀；样式全部集中在顶部工具栏。 */
    .component-inspector{width:auto!important;padding:7px!important;border-radius:9px!important}.component-inspector header,.component-inspector .component-text-hint,.component-inspector .component-inspector-row{display:none!important}.component-inspector footer{margin:0!important;padding:0!important;border:0!important}.component-inspector footer button{height:32px!important;min-width:92px!important}.component-inspector .inspector-reset{background:#FFF!important}.component-inspector .inspector-save{box-shadow:0 3px 8px rgba(255,186,50,.22)}
    /* 顶部组件样式是可预期的文章安全样式：内距、圆角、上下间距与内容对齐。 */
    .component-style-panel{display:grid;gap:12px;min-width:300px}.component-style-control{display:grid;grid-template-columns:42px 1fr 34px;gap:8px;align-items:center;color:#617187;font-size:11px}.component-style-control input{width:100%;accent-color:#2768FF}.component-style-control output{text-align:right;color:#2768FF;font-variant-numeric:tabular-nums}.component-style-align{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.component-style-align button{height:29px;border:1px solid #D8E2EE;border-radius:6px;background:#FFF;color:#718097;font:700 11px var(--ui-font);cursor:pointer}.component-style-align button.active,.component-style-align button:hover{border-color:#2768FF;background:#EFF4FF;color:#2768FF}.component-style-note{margin:0;padding-top:9px;border-top:1px solid #E6ECF4;color:#7B899C;font-size:10px;line-height:1.55}.component-color-modes{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 0 10px}.component-color-modes button{height:29px;border:1px solid #D9E2EE;border-radius:6px;background:#FFF;color:#718097;font:700 11px var(--ui-font);cursor:pointer}.component-color-modes button.active{border-color:#2768FF;background:#EFF4FF;color:#2768FF}.component-color-modes button:hover{border-color:#2768FF;color:#2768FF}
    /* V2.9：移除重复浮签，让素材区首行干净；说明文字降一级，不与主操作抢注意力。 */
    .image-dock:before{display:none!important}.image-dock{padding-top:10px!important}.image-dock-head{padding-top:0!important}
    .library-copy{font-size:11px!important;line-height:1.52!important}.library-tip,.image-dock .library-tip{font-size:10px!important;line-height:1.5!important}.component-card small,.saved-template span,.template-zero p,.component-text-hint,.component-style-note,.guide-page aside{font-size:10px!important;line-height:1.5!important}.editor-foot,.status{font-size:11px!important}
    .paper .author-logo{background-color:transparent!important;box-shadow:none!important}
    /* V3.0：手机容器使用与真机一致的裁切轮廓，清除透明 PNG 边缘残留。 */
    .device-mock.phone{border-radius:10.2% 10.2% 9.2% 9.2%!important;clip-path:inset(0 round 10.2% 10.2% 9.2% 9.2%)!important;overflow:hidden!important;background:transparent!important}
    .device-mock.phone .device-frame{border-radius:inherit!important;overflow:hidden!important}
    /* 二级分类是导航，不是内容卡片：收紧尺寸，为真正的组件预览留出空间。 */
    .component-subtabs{gap:5px!important;margin:0 0 9px!important;padding:5px!important;border-radius:8px!important}
    .component-subtabs button{height:25px!important;padding:0 3px!important;border-radius:5px!important;font-size:9px!important;letter-spacing:-.15px!important}
    /* V3.1：组件库卡片从展示型大卡收紧为工具库条目，提升可浏览密度。 */
    .library-section{padding:8px 8px 6px!important}.library-section h3{margin-bottom:7px!important;padding-bottom:6px!important}
    .component-card{min-height:70px!important;height:70px!important;margin:6px 0!important;padding:9px 10px!important;border-radius:8px!important}
    .component-copy{gap:3px!important}.component-copy b{font-size:13px!important;line-height:1.25!important}.component-copy small{font-size:10px!important;line-height:1.25!important}
    .component-icon{width:45px!important;height:45px!important;border-radius:10px!important}.component-icon svg{width:24px!important;height:24px!important}.component-card[data-component="xiaoling"] .component-icon{padding:3px!important}
    /* V3.2：手机外壳仅使用透明帧覆盖层，彻底隔离原图元素与外角裁切。 */
    .device-mock.phone{border-radius:10.8% 10.8% 9.7% 9.7%!important;clip-path:inset(0 round 10.8% 10.8% 9.7% 9.7%)!important;overflow:hidden!important}
    .device-mock.phone .device-frame{display:none!important}.device-mock.phone:after{content:"";position:absolute;z-index:6;inset:0;background:url('assets/preview/iphone-frame-cutout-nocamera.png') center / 100% 100% no-repeat;pointer-events:none}
    /* 每个资源页只保留一条用途说明，避免“可插入 / 可编辑”重复传达。 */
    .library-panel#componentsPanel:before,.library-panel#templatesPanel:before{display:flex!important;margin-bottom:10px!important}.library-panel .library-view-head,.library-panel#componentsPanel>.library-tip,.library-panel#templatesPanel>.library-tip{display:none!important}
    /* “资源库”作为当前资源状态移到页签右侧；模板态与全文模板采用同一暖黄色。 */
    .library-head:after{display:none!important}.tabs{align-items:center!important}.tabs:after{content:"资源库";flex:0 0 auto;margin-left:4px;padding:4px 6px;border-radius:5px;background:rgba(39,104,255,.08);color:#2768FF;font-size:10px;font-weight:700;white-space:nowrap}.library.templates-view .tabs:after{background:rgba(255,186,50,.18)!important;color:#956100!important}
    /* V3.3：资源状态归属大卡标题行；组件区按内容高度收束，素材区获得剩余空间。 */
    .library{grid-template-rows:auto auto auto minmax(285px,1fr)!important}.library-panel{height:auto!important;max-height:315px!important;overflow-y:auto!important}.image-dock{min-height:285px!important}
    .tabs:after{display:none!important}.library-title h2{display:flex;align-items:center;gap:7px}.library-title h2:after{content:"资源库";display:inline-block;padding:4px 6px;border-radius:5px;background:rgba(39,104,255,.08);color:#2768FF;font-size:10px;font-weight:700;line-height:1;white-space:nowrap}.library.templates-view .library-title h2:after{background:rgba(255,186,50,.18)!important;color:#956100!important}
    /* V3.4：小灵调整作用于整张形象卡片，卡片内图片始终完整居中。 */
    .xiaoling-avatar-slot,.render .xiaoling-avatar-slot{flex:0 0 var(--avatar-card-size,76px);width:var(--avatar-card-size,76px);height:var(--avatar-card-size,76px);transform:translate(var(--avatar-card-x,0px),var(--avatar-card-y,0px));transition:width .16s ease,height .16s ease,transform .16s ease}
    .xiaoling-avatar-slot img,.render .xiaoling-avatar-slot img{top:50%;left:50%;width:100%;height:100%;max-width:100%;max-height:100%;transform:translate(-50%,-50%);object-fit:contain;cursor:default}
    .avatar-card-preview{position:relative;height:166px;margin:13px 0;border:1px dashed #AFC4E1;border-radius:10px;background:linear-gradient(135deg,#F5F8FE,#EAF0FA);overflow:hidden;touch-action:none}.avatar-card-preview:before{content:"拖拽整张小灵形象卡片调整位置";position:absolute;right:9px;bottom:7px;color:#8190A5;font-size:10px}.avatar-card-preview .avatar-card{position:absolute;top:45px;left:calc(50% - 38px);display:grid;place-items:center;width:76px;height:76px;border:1px dashed #8FAEFF;border-radius:10px;background:#FFF;overflow:hidden;box-shadow:0 4px 12px rgba(39,104,255,.11);cursor:grab;user-select:none}.avatar-card-preview .avatar-card.dragging{cursor:grabbing}.avatar-card-preview .avatar-card img{width:100%;height:100%;object-fit:contain}
    /* V3.5：多图排版、图片图注与小灵卡片的实例级编辑。 */
    /* 手机安全预览不展示拟物摄像头 / 灵动岛，避免在文章上方留下异常黑点。 */
    .device-mock.phone:before{display:none!important}
    .image-grid.custom-grid{grid-template-columns:repeat(var(--gallery-columns,3),minmax(0,1fr));align-items:start}.gallery-item{position:relative;min-width:0;margin:0;cursor:grab}.editor .gallery-item.gallery-active{outline:2px solid #2768FF;outline-offset:3px;border-radius:7px}.gallery-item.dragging{opacity:.42;cursor:grabbing}.gallery-item.drop-before{box-shadow:-3px 0 0 #2768FF}.gallery-item.drop-after{box-shadow:3px 0 0 #2768FF}.image-grid .gallery-item img{width:100%;height:95px;object-fit:cover;margin:0;border-radius:6px}.image-grid .gallery-item .image-slot{height:95px}.image-caption{margin:8px 0 18px;color:#80858d;font-size:12px;line-height:1.7;text-align:center}.gallery-toolbar{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0;padding-top:10px;border-top:1px dashed #D7DEE8}.gallery-toolbar button{padding:5px 8px!important;border:1px solid #D8E2F2!important;border-radius:5px!important;background:#FFF!important;color:#4D668B!important;font-size:11px!important;font-weight:600!important}.gallery-toolbar button.active,.gallery-toolbar button:hover{border-color:#2768FF!important;background:#F2F6FF!important;color:#2768FF!important}.render [data-editor-only]{display:none}.gallery-editor-modal{width:min(560px,94vw)}.gallery-picker-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;max-height:260px;overflow:auto;margin:14px 0}.gallery-picker-image{position:relative;aspect-ratio:1;border:1px solid #E0E2E4;border-radius:7px;overflow:hidden;background:#F7F8FC;cursor:pointer}.gallery-picker-image:hover{border-color:#2768FF;box-shadow:0 0 0 2px rgba(39,104,255,.12)}.gallery-picker-image img{width:100%;height:100%;object-fit:cover}.image-caption-modal{width:min(420px,92vw)}.image-caption-preview{display:block;max-width:100%;max-height:190px;margin:10px auto 14px;border-radius:8px}.image-caption-input{box-sizing:border-box;width:100%;min-height:76px;padding:10px;border:1px solid #D8DFEA;border-radius:7px;outline:0;resize:vertical;font:13px/1.6 var(--ui-font)}.image-caption-input:focus{border-color:#2768FF;box-shadow:0 0 0 3px rgba(39,104,255,.1)}.image-caption-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.image-caption-actions button{height:34px;padding:0 13px;border:1px solid #D8DFEA;border-radius:6px;background:#FFF;color:#566577;font:12px var(--ui-font);cursor:pointer}.image-caption-actions .primary{border-color:#2768FF;background:#2768FF;color:#FFF}.editor .component.xiaoling-note,.render .component.xiaoling-note{position:relative;overflow:visible;min-height:108px}.xiaoling-avatar-slot,.render .xiaoling-avatar-slot{position:relative;z-index:2;will-change:transform}
    /* V3.9：小灵形象是注释卡片内的独立对象，定位直接使用卡片坐标，而非 flex 位移。 */
    .editor .component.xiaoling-note,.render .component.xiaoling-note{position:relative;display:block;overflow:hidden;min-height:108px}
    .editor .xiaoling-avatar-slot,.render .xiaoling-avatar-slot{position:absolute;z-index:2;left:var(--avatar-card-left,12px);top:var(--avatar-card-top,12px);width:var(--avatar-card-size,76px);height:var(--avatar-card-size,76px);flex:none;transform:none;background:#FFF url('assets/xiaoling/xiaoling-primary.png') center / contain no-repeat}
    .editor .xiaoling-avatar-slot img,.render .xiaoling-avatar-slot img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:100%;max-height:100%;margin:0;transform:none;object-fit:contain;z-index:1}
    .editor .xiaoling-note-copy,.render .xiaoling-note-copy{min-height:76px;margin-left:88px}
    .editor .xiaoling-note .label,.render .xiaoling-note .label{display:none}
    .component-inspector footer{justify-content:flex-start!important}
    .component-inspector .inspector-delete{border:1px solid #F0CACA!important;background:#FFF!important;color:#C94A4A!important}
    .component-inspector .inspector-delete:hover{border-color:#D95A5A!important;background:#FFF4F4!important}
    .backup-button{border-color:#C8D8EE!important;background:linear-gradient(180deg,#FFF,#F4F8FD)!important;color:#3C6092!important}.backup-button:hover{border-color:#8EADD3!important;color:#2768FF!important}.backup-modal{width:min(470px,92vw)}.backup-summary{display:flex;flex-direction:column;gap:5px;margin:18px 0;padding:12px 13px;border:1px solid #DDE7F5;border-radius:8px;background:#F5F8FD}.backup-summary b{font-size:12px;color:#294B78}.backup-summary span{font-size:11px;line-height:1.6;color:#71809A}.backup-actions{display:grid;grid-template-columns:1fr 1.15fr;gap:9px}.backup-actions .button,.backup-actions .modal-action{height:39px}.backup-actions .button{color:#3C6092;border-color:#C8D8EE;background:#FFF}
    .article-style-button{border-color:#D5DDF0!important;background:linear-gradient(180deg,#FFF,#F7F8FE)!important;color:#4B5E8A!important}.article-style-button:hover{border-color:#9BB7ED!important;color:#2768FF!important}.article-style-modal{width:min(550px,94vw)}.article-style-modal h2{margin-bottom:6px}.article-style-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.article-style-field{padding:11px 12px;border:1px solid #E1E6F0;border-radius:8px;background:#FAFBFE}.article-style-field label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:700;color:#3D4C69}.article-style-field output{min-width:42px;text-align:right;color:#2768FF;font-weight:700;font-size:12px}.article-style-field input[type=range]{width:100%;margin:11px 0 0;accent-color:#2768FF}.article-style-field select,.article-style-field input[type=color]{height:30px;margin-top:10px;border:1px solid #D8E0ED;border-radius:5px;background:#FFF;color:#58677F;font:12px var(--ui-font);outline:none}.article-style-field select{width:100%;padding:0 8px}.article-style-field input[type=color]{width:100%;padding:3px 5px;cursor:pointer}.article-style-note{margin:-4px 0 14px;font-size:11px;line-height:1.65;color:#7D8798}.article-style-actions{display:flex;justify-content:flex-end;gap:9px}.article-style-actions .button,.article-style-actions .modal-action{height:38px;min-width:112px}.editor>p,.render>p{font-size:var(--article-base-size,15px);line-height:var(--article-line-height,1.9);color:var(--article-text-color,#666);margin-bottom:var(--article-paragraph-space,16px)}.editor>ul,.editor>ol,.render>ul,.render>ol{font-size:var(--article-base-size,15px);line-height:var(--article-line-height,1.9);color:var(--article-text-color,#666)}.editor>img,.render>img{border-radius:var(--article-image-radius,7px)}.editor.article-chapter-left>h2{color:var(--article-chapter-color,#2768FF);text-align:left;border-left:4px solid #FFBA32;border-bottom:0;padding-left:10px}.paper.article-chapter-left .render>h2{color:var(--article-chapter-color,#2768FF);text-align:left;border-left:4px solid #FFBA32;border-bottom:0;padding:0 0 0 10px}.paper.article-chapter-left .render>h2 span{padding:0;border:0}#componentsPanel .component-subtabs button:before{background:#2768FF!important;opacity:.72!important}#componentModal .modal-box{width:min(680px,94vw)}#componentModal .component-variants{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}#componentModal .variant-card{display:grid;grid-template-rows:auto auto minmax(142px,1fr);gap:0;padding:12px;min-width:0}#componentModal .variant-preview{height:142px;min-height:142px;padding:10px;overflow:auto;border:1px solid #E8ECF3;border-radius:6px;background:#F8FAFD;scrollbar-width:thin;scrollbar-color:#B9C6DA transparent}#componentModal .variant-preview::-webkit-scrollbar{width:5px}#componentModal .variant-preview::-webkit-scrollbar-thumb{border-radius:5px;background:#B9C6DA}#componentModal .variant-preview .template-layout{width:auto!important;min-width:0!important;min-height:0!important;height:auto!important;max-width:100%!important;transform:none!important}#componentModal .variant-preview .component{min-height:0!important;height:auto!important;margin:0!important;padding:10px!important;overflow:visible!important}#componentModal .variant-preview .component .label{margin:0 0 5px!important;font-size:9px!important;line-height:1.2!important;letter-spacing:.6px!important}#componentModal .variant-preview .component h3{margin:0 0 5px!important;padding:0!important;border:0!important;font-size:12px!important;line-height:1.4!important;color:#202020!important}#componentModal .variant-preview .component p{margin:0!important;font-size:10px!important;line-height:1.55!important;color:#667085!important}#componentModal .variant-preview blockquote{margin:0!important;padding:8px 9px!important;font-size:11px!important;line-height:1.5!important}#componentModal .variant-preview h2{margin:7px 0!important;font-size:13px!important;line-height:1.4!important}@media(max-width:620px){#componentModal .component-variants{grid-template-columns:1fr}#componentModal .variant-preview{height:132px;min-height:132px}}
    /* V4.2：分类色贯穿到卡片图标；中间创作画布与手机正文宽度保持一致。 */
    #componentColorPopover .color-grid{grid-template-columns:repeat(9,minmax(0,1fr));gap:7px;width:100%}
    #componentColorPopover .swatch{width:100%;height:auto;aspect-ratio:1 / 1}
    #componentsPanel .library-section[data-component-section="basic"] .component-icon{background:#F4F7FF!important;color:#2768FF!important}
    #componentsPanel .library-section[data-component-section="layout"] .component-icon{background:#F6F0FF!important;color:#7A22F6!important}
    #componentsPanel .library-section[data-component-section="action"] .component-icon{background:#FFF8E7!important;color:#A96F00!important}
    #componentsPanel .library-section[data-component-section="custom"] .component-icon{background:#F1F3FF!important;color:#5C67B8!important}
    .editor-side{background:#F4F7FB!important}.editor{width:min(390px,calc(100% - 32px))!important;margin:18px auto!important;padding:25px 20px 34px!important;align-self:center!important;background:#FFF!important;border:1px solid #E1E7F0!important;border-radius:18px!important;box-shadow:0 8px 22px rgba(31,50,83,.08)!important;scrollbar-width:none!important}.editor::-webkit-scrollbar{width:0!important;height:0!important}.editor>h1{font-size:25px}.editor>h2{font-size:19px}.editor>h3{font-size:16px}.editor .component p{font-size:13px;line-height:1.8;color:#666}.editor .component.image-note{background:#F8FAFE;border-color:#E0E2E4}.editor .component.info-card{background:#F2F6FF;border:1px solid #C9D8FF;border-left:4px solid #2768FF}.editor .component.outline-card{background:#FFF;border-color:#2768FF}.editor .component.warning-card{background:#FFF8E7;border-color:#F5D789;border-left:4px solid #FFBA32}.editor .component.cta{background:#FFF9E8;border-color:#F5D789}.preview-body.phone-scene .device-mock.phone{width:390px!important;height:832px!important;max-width:none!important;flex:0 0 390px!important;transform:scale(var(--phone-preview-scale,1))!important;transform-origin:center center!important}.preview-body.phone-scene .device-mock.phone .paper{width:100%!important;height:100%!important;padding:25px 20px 34px!important}#customComponents .component-card{position:relative!important;padding-right:62px!important}#customComponents .component-card:after{content:"✦";position:absolute;right:14px;top:50%;display:grid;place-items:center;width:32px;height:32px;border-radius:9px;transform:translateY(-50%);background:#F1F3FF;color:#5C67B8;font-size:18px;font-weight:700}
    /* 组件定位面板：先决定卡片在正文中的位置，再决定卡片内文字的对齐。 */
    .component-style-group{margin:10px 0;padding:9px 10px;border:1px solid #E4EAF3;border-radius:7px;background:#F8FAFE}.component-style-group>small{display:block;margin-bottom:7px;color:#7B889A;font-size:10px;font-weight:700}.component-style-align{display:flex;gap:6px}.component-style-align button{flex:1;min-width:0}.component-style-align button.active{border-color:#2768FF;background:#EDF3FF;color:#2768FF;box-shadow:inset 0 0 0 1px rgba(39,104,255,.08)}
    /* 官方模板：黄色只作为阅读锚点，正文仍以白底与深色文字为主。 */
    .official-template-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:16px 0 8px;padding-top:15px;border-top:1px solid #E8ECF2}.official-template-head b{font-size:12px;color:#343E52}.official-template-head span{font-size:10px;color:#9AA4B4}.official-template{border-color:#F0D38E;background:linear-gradient(180deg,#FFFDF8 0%,#FFF 100%)}.official-template:hover{border-color:#FFBA32;background:#FFFDF8}.official-template .template-actions{grid-template-columns:1fr 1fr}.official-template .template-actions button:last-child{grid-column:1 / -1}.official-template-tag{display:inline-flex;align-items:center;height:18px;margin-left:6px;padding:0 6px;border-radius:9px;background:#FFF1CC;color:#976100;font-size:9px;font-weight:700;vertical-align:1px}.template-group-label{margin:18px 0 7px;color:#7B889A;font-size:11px;font-weight:700}.template-group-label:before{content:"";display:inline-block;width:3px;height:12px;margin-right:6px;border-radius:3px;background:#FFBA32;vertical-align:-2px}
    /* 通用组件默认采用灵心黄的浅底 + 黄边，保证正式阅读不刺眼；小灵 IP 注释保留自身识别色。 */
    .editor .component.image-note,.render .component.image-note,.editor .component.image-text,.render .component.image-text{background:#FFF9E8;border-color:#F5D789}.editor .component.image-note .label,.render .component.image-note .label,.editor .component.image-text .label,.render .component.image-text .label{color:#A96F00}
    .full-template-preview-modal{width:min(760px,94vw)!important;padding:0!important;overflow:hidden!important}.full-template-preview-head{padding:20px 22px 14px;border-bottom:1px solid #E8ECF2}.full-template-preview-head h2{margin:0 0 6px}.full-template-preview-head p{margin:0;color:#7B889A;font-size:12px;line-height:1.6}.workflow-mapping{display:grid;gap:6px;max-height:158px;margin-top:12px;padding:10px;border:1px solid #E4EAF2;border-radius:8px;background:#F8FAFD;overflow:auto}.workflow-mapping-empty{margin:0;color:#8B96A8;font-size:11px}.workflow-map-row{display:grid;grid-template-columns:minmax(0,1fr) 122px;align-items:center;gap:10px;padding:6px 7px;border-radius:6px;background:#FFF}.workflow-map-row b{overflow:hidden;color:#3D485A;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.workflow-map-row select{height:27px;border:1px solid #D7E0EC;border-radius:5px;background:#FFF;color:#566277;padding:0 6px;font:11px var(--ui-font);outline:none}.workflow-map-row select:focus{border-color:#2768FF}.full-template-preview-stage{max-height:min(62vh,660px);padding:22px;overflow:auto;background:#F4F7FB}.full-template-preview-paper{width:min(390px,100%);margin:0 auto;padding:26px 20px 34px;background:#FFF;border:1px solid #E1E7F0;border-radius:18px;box-shadow:0 9px 24px rgba(31,50,83,.1)}.full-template-preview-paper h1{margin:0 0 18px;color:#202020;font-size:23px;line-height:1.48;text-align:center}.full-template-preview-paper h2{margin:30px 0 13px;padding-left:9px;border-left:4px solid #FFBA32;color:#202020;font-size:18px;line-height:1.5}.full-template-preview-paper h3{margin:0 0 6px;color:#202020;font-size:15px}.full-template-preview-paper p{margin:0 0 14px;color:#666;font-size:14px;line-height:1.85}.full-template-preview-paper blockquote{margin:16px 0;padding:10px 12px;border-left:3px solid #FFBA32;background:#FFF9E8;color:#6B4B00;font-size:14px;line-height:1.75}.full-template-preview-paper .component{margin:16px 0;padding:13px;border:1px solid #F5D789;border-radius:8px;background:#FFF9E8}.full-template-preview-paper .component .label{margin-bottom:6px;color:#A96F00;font-size:12px;font-weight:700;letter-spacing:.8px}.full-template-preview-paper .component.cta{text-align:center}.full-template-preview-paper .component button{border:0;border-radius:5px;background:#FFBA32;color:#202020;padding:8px 12px;font:700 12px var(--ui-font)}.full-template-preview-actions{display:flex;justify-content:flex-end;gap:9px;padding:14px 22px;border-top:1px solid #E8ECF2;background:#FFF}.full-template-preview-actions .button,.full-template-preview-actions .modal-action{height:38px;min-width:118px}
    /* 编辑画布与设备内正文只允许使用同一份排版规则。设备外框只负责展示，不参与正文计算。 */
    .editor{border:0!important}.editor>h1,.paper .render>h1{margin:0 0 18px;color:#202020;font-size:22px;line-height:1.45;text-align:left}.paper .render>h1:after{display:none}.editor>h2,.paper .render>h2{margin:34px 0 15px;padding-left:10px;border:0;border-left:4px solid #FFBA32;color:#202020;font-size:19px;line-height:1.55;text-align:left}.paper .render>h2 span{display:inline;padding:0;border:0;line-height:inherit}.editor>h3,.paper .render>h3{margin:25px 0 10px;padding:0;border:0;color:#202020;font-size:16px;line-height:1.65;text-align:left}.editor>p,.paper .render>p{margin:0 0 var(--article-paragraph-space,16px);color:var(--article-text-color,#666);font-size:var(--article-base-size,15px);line-height:var(--article-line-height,1.9);text-align:left}.editor>blockquote,.paper .render>blockquote{margin:18px 0;padding:13px 15px;border-left:4px solid #FFBA32;background:#FFF9E8;color:#6B4B00;font-size:15px;font-weight:700;line-height:1.85;text-align:left}.editor>ul,.editor>ol,.paper .render>ul,.paper .render>ol{margin:12px 0;padding-left:24px;color:var(--article-text-color,#666);font-size:var(--article-base-size,15px);line-height:var(--article-line-height,1.9)}.editor>li,.paper .render>li{margin:7px 0}.editor .component,.paper .render .component{box-sizing:border-box;color:#666;font-size:15px;line-height:1.9}.editor .component h3,.paper .render .component h3{margin:0 0 7px;padding:0;border:0;color:#202020;font-size:16px;line-height:1.6;text-align:left}.editor .component p,.paper .render .component p{margin:0;color:#666;font-size:13px;line-height:1.75;text-align:left}.editor .component .label,.paper .render .component .label{font-size:10px;line-height:1.35}.device-mock.device-dark .render>h1,.device-mock.device-dark .render>h2,.device-mock.device-dark .render>h3{color:#F4F5F7}.device-mock.device-dark .render>p,.device-mock.device-dark .render>ul,.device-mock.device-dark .render>ol,.device-mock.device-dark .render .component p{color:#C8CBD2}.device-mock.device-dark .render>blockquote{background:#302A1A;border-left-color:#FFBA32;color:#FFE1A4}
    .editor .component .label,.paper .render .component .label{color:#A96F00}
    /* 全文模板只重排原稿内容：样式落在标题、导语、章节与列表本身，不额外插入空卡片。 */
    .editor [data-workflow-role="lead"],.render [data-workflow-role="lead"]{font-size:16px;line-height:1.85;color:#4E5158;margin:0 0 28px}
    .editor [data-workflow="product"][data-workflow-role="lead"],.render [data-workflow="product"][data-workflow-role="lead"]{font-weight:600;color:#3F434A}
    .editor h2[data-workflow="product"],.render h2[data-workflow="product"]{padding:0 0 10px;border-left:0;border-bottom:2px solid #FFBA32;color:#202020;text-align:left}
    .editor h3[data-workflow="product"],.render h3[data-workflow="product"]{padding-left:10px;border-left:3px solid #FFBA32;color:#202020}
    .editor [data-workflow="guide"][data-workflow-role="lead"],.render [data-workflow="guide"][data-workflow-role="lead"]{padding:11px 13px;border-left:3px solid #FFBA32;background:#FFF9E8;color:#6B4B00}
    .editor h2[data-workflow="guide"],.render h2[data-workflow="guide"]{padding:10px 12px;border:0;border-left:4px solid #FFBA32;border-radius:5px;background:#FFF9E8;color:#202020;text-align:left}
    .editor h3[data-workflow="guide"],.render h3[data-workflow="guide"]{padding-left:10px;border-left:3px solid #F5D789;color:#6B4B00}
    .editor h2[data-workflow="case"],.render h2[data-workflow="case"]{padding-left:12px;border-left:4px solid #FFBA32;color:#202020;text-align:left}
    .editor h3[data-workflow="case"],.render h3[data-workflow="case"]{padding-left:0;border-left:0;color:#A96F00}
  
/* template-studio.css */
.studio-actions{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 12px}.studio-actions button{min-height:30px;height:auto;padding:5px 9px}.studio-hint{font-size:11px;line-height:1.7;color:#6b7280;margin:8px 0}.studio-modal{max-width:920px;width:94vw;max-height:88vh;display:flex;flex-direction:column;padding:24px!important}.studio-modal h2{margin:0 32px 10px 0}.studio-body{overflow:auto;min-height:0;padding:2px 4px 12px}.studio-body label{display:block;font-size:12px;color:#444;margin:12px 0 6px}.studio-body input:not([type=file]),.studio-body textarea,.studio-body select{box-sizing:border-box;width:100%;padding:9px 10px;border:1px solid #dce1e8;border-radius:7px;background:white;font:13px var(--ui-font)}.studio-body textarea{min-height:100px;resize:vertical}.studio-footer{display:flex;gap:8px;justify-content:flex-end;border-top:1px solid #eee;padding-top:12px;flex-wrap:wrap}.studio-footer .modal-action{width:auto;padding:0 18px}.studio-source{border:1px solid #e1e5eb;border-radius:9px;padding:12px;margin:10px 0;background:#fafbfc;overflow-wrap:anywhere}.studio-source h3{font-size:14px;margin:0 0 8px}.studio-source p{font-size:12px;line-height:1.7;white-space:pre-wrap}.studio-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.studio-result{white-space:pre-wrap;line-height:1.7;font-size:12px;color:#675221;background:#fffaec;border:1px solid #f0deb0;padding:12px;border-radius:8px}.studio-status{font-size:11px;color:#806014}.studio-chip{border:1px solid #ead9b6;background:#fff9e9;border-radius:5px;padding:2px 5px;font-size:10px;color:#82611c;margin-left:8px}.studio-body .studio-card-preview{background:white;padding:16px;border:1px solid #eee;max-width:375px;margin:12px auto;overflow-wrap:anywhere}.studio-preview-paper{width:375px!important;min-width:375px;max-width:none!important;box-sizing:border-box;padding:20px 16px!important;background:#fff;color:#333;margin:0 auto}.studio-preview-paper *{box-sizing:border-box;max-width:100%}.studio-preview-paper .component{resize:none!important;outline:0!important}.workflow-mapping{max-height:190px;overflow:auto;display:block!important}.workflow-map-row{display:grid!important;grid-template-columns:minmax(0,1fr) 110px;gap:8px;margin:6px 0;align-items:center}.workflow-map-row b{font-weight:500!important;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workflow-map-row select{min-width:0;width:110px}.studio-outline{font-size:11px;line-height:1.6;color:#616b7b}.studio-error{color:#b42318!important;background:#fff1ee!important}.studio-history-row{display:flex;gap:12px;justify-content:space-between;align-items:center;border-bottom:1px solid #eee;padding:10px 0;font-size:12px}.studio-sample-link{color:#785500}.studio-components .small-button{margin:4px}.studio-import-state{font-size:12px;padding:10px;border-radius:8px;background:#f6f8fc;line-height:1.8}.studio-modal img{max-width:100%;height:auto}.studio-reference-shot{max-height:240px;object-fit:contain}.studio-main-status{font-size:11px;color:#64748b}.studio-hidden{display:none!important}@media(max-width:700px){.studio-two{grid-template-columns:1fr}.studio-modal{padding:16px!important}.studio-preview-paper{width:340px!important;min-width:340px}}
.paper .render h1:after,.paper .render h2 span:after{display:none!important}.paper .render h2 span{display:inline;padding:0;border:0;line-height:inherit}.editor .component:not(.xiaoling-note) p{font-size:var(--article-base-size,15px);line-height:var(--article-line-height,1.9);margin:0 0 var(--article-paragraph-space,16px)}.editor .component{overflow-wrap:anywhere}.studio-preview-paper h2 span{padding:0;border:0;line-height:inherit}.studio-modal{z-index:1}.full-template-preview-modal{max-height:92vh!important;display:flex;flex-direction:column}.full-template-preview-stage{flex:1;min-height:0}.full-template-preview-head,.full-template-preview-actions{flex:none}#fullTemplatePreviewModal{z-index:45}#editor{font-family:Microsoft YaHei,PingFang SC,sans-serif}.studio-status-note{font-size:10px;color:#8b919b}
#editor{font-family:var(--article-font)}
#editor#editor{font-family:var(--article-font)}.studio-modal>.modal-close{position:absolute;top:16px;right:16px;float:none}.studio-modal{position:relative}.studio-modal>.studio-body{padding-top:8px}#templatesPanel:before{display:none!important}#templatesPanel .official-template-head{margin:6px 0 8px;padding-top:6px}#templatesPanel .studio-actions{margin-top:0}.device-mock.device-dark .render{color:#d2d2d2}
#fullTemplatePreviewCanvas.studio-preview-paper{width:390px!important;min-width:390px!important;padding:25px 20px 34px!important}
#editor:before,#editor h1:after,#editor h2:after,#editor h2 span:after{display:none!important}
#editor h2 span{display:inline;border:0;padding:0;line-height:inherit}
#editor .xiaoling-note{display:block!important;min-height:0!important;position:relative;padding:16px}
#editor .xiaoling-stage{position:relative;overflow:hidden;isolation:isolate}
#editor .xiaoling-stage .xiaoling-avatar-slot{position:absolute!important;left:var(--avatar-card-left,12px)!important;top:var(--avatar-card-top,12px)!important;width:var(--avatar-card-size,76px)!important;height:var(--avatar-card-size,76px)!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;transform:none!important;overflow:hidden!important;border-radius:0!important;resize:none!important}
#editor .xiaoling-stage .xiaoling-avatar-slot img{position:static!important;display:block!important;width:var(--avatar-image-width,100%)!important;height:var(--avatar-image-height,100%)!important;object-fit:contain!important;max-width:100%!important;margin:var(--avatar-image-margin,0)!important;padding:0!important;transform:none!important;border:0!important;border-radius:0!important}
#editor .xiaoling-note-copy{display:block!important;width:auto!important;padding:0!important;margin:0!important;min-width:0!important;min-height:0!important}
#editor .image-text-row{display:block!important}#editor .image-text-media,#editor .image-text-copy{width:auto!important;max-width:100%!important;flex:none!important}
.recipe-thumbnail{width:66px;height:98px;overflow:hidden;border:1px solid #e9e6df;border-radius:5px;background:#fff;margin:0;pointer-events:none;flex:none}
.recipe-thumbnail>section{width:350px;padding:14px 18px;transform:scale(.185);transform-origin:top left;box-sizing:border-box}
.recipe-thumbnail .component{box-sizing:border-box;max-width:100%}.recipe-thumbnail p{font-size:15px;line-height:1.9;margin:0 0 12px}
#templatesPanel .saved-template{padding:10px!important;border-radius:10px!important;margin:0 0 9px!important;background:#fff!important}
#templatesPanel .saved-template>span{font-size:11px;line-height:1.65;color:#747780;display:block;margin:6px 0 9px}
#templatesPanel .template-actions{gap:5px;flex-wrap:wrap}#templatesPanel .template-actions button{flex:1 1 auto;white-space:nowrap;min-height:27px}
.studio-sample-paper{width:390px;max-width:100%;box-sizing:border-box;background:#fff;border:1px solid #e7e7e7;padding:25px 20px;margin:12px auto}
.catalog-icon{margin-left:auto;color:var(--section-accent,#8063b1);font-size:26px;line-height:1}
.library-section[data-component-section=basic] .catalog-icon{color:#6b85b4}.library-section[data-component-section=layout] .catalog-icon{color:#9473ba}.library-section[data-component-section=action] .catalog-icon{color:#bc9460}
.variant-preview{box-sizing:border-box}.variant-preview .component{max-width:100%;box-sizing:border-box}.variant-preview table{width:100%;border-collapse:collapse}.variant-preview td,.variant-preview th{border:1px solid #e5e7eb;padding:8px;overflow-wrap:anywhere}
.component-density-presets{display:flex;gap:6px;margin:0 0 14px}.component-density-presets button{flex:1;padding:7px;border:1px solid #e0e3e9;border-radius:6px;background:#fafbfe;color:#46546b;cursor:pointer}.component-density-presets button:hover{border-color:#ffba32;background:#fff9e8}
.catalog-icon{display:flex;width:30px;height:30px;align-items:center;justify-content:center}.catalog-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* Compact browse surface; the full-size page is one click away. */
#templatesPanel .recipe-row{display:flex;gap:10px;align-items:flex-start;cursor:default;border-left-width:1px!important}
#templatesPanel .recipe-row:before{display:none!important}.recipe-row-copy{min-width:0;flex:1}.recipe-row-copy>b{display:block;font-size:13px;color:#26272b;line-height:1.4;margin:1px 0 5px}.recipe-row-copy>span{display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.6!important;font-size:10px!important;color:#777b82!important;min-height:32px;margin:0 0 7px!important}
.recipe-more{font-size:10px;position:relative;align-self:center}.recipe-more summary{cursor:pointer;color:#737983;padding:4px;list-style:none}.recipe-more[open]{flex-basis:100%;display:flex;flex-wrap:wrap}.recipe-more[open] button{margin:4px 5px 0 0}.recipe-more button{font-size:10px!important}
.template-view-options{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding-bottom:5px}.template-view-options select{font-size:11px;border:1px solid #dfe3e8;border-radius:6px;background:#fff;padding:6px;max-width:175px}.template-view-options input[type=color]{width:32px;height:30px;padding:2px;border:1px solid #dfe3e8;border-radius:5px;cursor:pointer}
.catalog-more{margin-top:9px;border-top:1px solid #e5e2ed;padding-top:10px}.catalog-more summary{list-style:none;font-size:12px;color:#71647f;cursor:pointer;font-weight:700}.catalog-more summary:before{content:'＋';margin-right:5px}.catalog-more[open] summary:before{content:'−'}.catalog-more summary small{display:block;font-size:10px;line-height:1.7;color:#95909d;font-weight:400;padding-left:16px}
.image-dock-head{gap:6px}.image-dock-head>span{margin-right:auto}.image-dock-head button{font-size:10px;padding:0 6px}.image-dock:focus-visible{outline:2px solid #b6c6e1;outline-offset:-2px}
.structure-box{width:min(1120px,94vw)!important;max-width:1120px!important;height:88vh;max-height:88vh!important;padding:24px!important;display:flex;flex-direction:column;gap:10px;background:#fafbfc!important}
.structure-box>header{display:flex;justify-content:space-between;align-items:center;flex:none}.structure-box h2{margin:3px 0 0;font-size:21px}.structure-box header small{font-size:10px;color:#8a7350;letter-spacing:1px}.structure-help{font-size:12px;color:#727984;margin:0;line-height:1.7}.structure-input{display:flex;gap:12px;align-items:end}.structure-input[hidden]{display:none}.structure-input label{flex:1;font-size:12px}.structure-input textarea{display:block;width:100%;height:108px;resize:vertical;box-sizing:border-box;padding:12px;margin-top:6px;border:1px solid #dce0e7;border-radius:8px;font:13px/1.7 var(--ui-font)}
.structure-tools{display:flex;gap:6px;flex-wrap:wrap;align-items:center;border-block:1px solid #e5e7eb;padding:10px 0;flex:none}.structure-tools>span{font-size:11px;color:#7b818c;margin-right:10px}.structure-message{margin:0;font-size:11px;color:#866022;min-height:16px}
.structure-columns{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:22px;min-height:0;flex:1}.structure-rows{overflow:auto;padding:1px 8px 8px 1px;overscroll-behavior:contain}.structure-row{display:grid;grid-template-columns:16px minmax(0,1fr) 112px;gap:9px;align-items:center;background:white;border:1px solid #e3e6eb;border-radius:8px;padding:12px 10px;margin-bottom:8px}.structure-row.candidate{border-color:#edd69f;background:#fffdf6}.structure-row b{font-size:12px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:500}.structure-row small{display:block;font-size:10px;color:#949aa4;margin-top:4px}.structure-row select{width:100%;border:1px solid #e3e6eb;border-radius:5px;padding:6px 3px;font-size:11px;background:#fafbfc}.structure-live{min-height:0;overflow:auto;background:#ebeef2;border:1px solid #e2e5e9;border-radius:10px;overscroll-behavior:contain}.structure-live>small{display:block;padding:10px 14px;font-size:10px;color:#737b89}.structure-live article{padding:25px 20px;background:white;box-sizing:border-box;min-height:100%}.structure-box>footer{border-top:1px solid #e2e5eb;padding-top:12px;display:flex;gap:8px;align-items:center;flex:none}.structure-box>footer>span{margin-right:auto;font-size:11px;color:#878d97}.structure-box>footer button{width:auto;padding:0 15px}.structure-box>footer .button{height:36px}
@media(max-width:850px){.structure-columns{grid-template-columns:1fr}.structure-live{display:none}.structure-box>footer>span{display:none}}
#componentModal .modal-box{width:min(820px,94vw);max-width:820px;max-height:90vh;display:flex;flex-direction:column}
#componentVariants.component-choice-layout{display:grid!important;grid-template-columns:210px minmax(0,1fr)!important;gap:18px;min-height:200px;max-height:58vh;overflow:hidden;margin:12px 0}
.component-choice-list{overflow:auto;min-height:0;padding-right:6px;overscroll-behavior:contain}.component-choice-list .variant-card{width:100%;height:auto!important;min-height:0!important;text-align:left;padding:12px!important;margin:0 0 7px;display:block}.component-choice-list .variant-card b{font-size:12px;display:block}.component-choice-list .variant-card small{font-size:10px;line-height:1.6;display:block;margin-top:5px;color:#9095a0}.component-choice-archive summary{font-size:11px;color:#737986;padding:10px 0;cursor:pointer}
.component-choice-stage{min-height:0;overflow:auto;background:#f2f3f5;border:1px solid #e2e5e9;border-radius:9px;overscroll-behavior:contain}.component-choice-stage>small{display:block;padding:10px 12px;font-size:10px;color:#8b9099}.component-real-preview{width:390px;max-width:100%;padding:20px;box-sizing:border-box;background:white;margin:auto}.component-real-preview .component{box-sizing:border-box;max-width:100%}
@media(max-width:650px){#componentVariants.component-choice-layout{grid-template-columns:1fr!important;overflow:auto}.component-choice-list{display:flex;gap:8px;overflow:auto;min-height:90px}.component-choice-list .variant-card{min-width:160px}}
#templatesPanel .recipe-row .template-actions{gap:4px;flex-wrap:wrap}#templatesPanel .recipe-row .template-actions>button{padding:0 4px;font-size:10px;flex:0 0 auto}.recipe-more summary{font-size:16px;padding:0 2px;line-height:24px}
#templatesPanel .library-view-head,#templatesPanel .official-template-head{display:none!important}
#componentModal .component-choice-list .variant-card{height:auto!important;min-height:0!important;max-height:none!important;display:block!important;flex:none!important;align-self:start}
#componentModal .component-choice-list{display:block!important}
#componentModal .modal-box>.modal-close{position:absolute;right:16px;top:14px;left:auto;float:none}
#componentModal .modal-box{position:relative}
.library-panel#templatesPanel:before{display:none!important}
/* Thumbnail is the sample entry; controls don't masquerade as article content. */
.recipe-thumbnail{pointer-events:auto;position:relative;cursor:pointer;padding:0;text-align:left;transition:border-color .18s,box-shadow .18s}
.recipe-thumbnail:hover,.recipe-thumbnail:focus-visible{border-color:#ba892b;box-shadow:0 0 0 2px #ffedc4;outline:none}
.recipe-thumbnail>section{pointer-events:none}.recipe-thumbnail>small{position:absolute;inset:auto 0 0;padding:4px 0;background:#fff7e8;color:#79571b;font:10px/1.2 var(--ui-font);text-align:center;border-top:1px solid #f0e3c9}
.catalog-purpose{font-size:10px;color:#89838f;margin:0 0 10px;line-height:1.5;grid-column:1/-1}
.component-variant-search{width:100%;box-sizing:border-box;border:1px solid #DCE1E8;border-radius:6px;background:#FAFBFD;font:12px var(--ui-font);padding:9px;margin-bottom:10px;outline:none}.component-variant-search:focus{border-color:#BD9141;box-shadow:0 0 0 2px #FFF3D5}#componentModal .variant-card[hidden]{display:none!important}.component-real-preview,.studio-sample-paper,.recipe-thumbnail>section{font-weight:400}.workflow-media-row{align-items:start}.workflow-media-row select{max-width:100%;min-width:0}
.catalog-more{grid-column:1/-1}.catalog-more>.component-card{margin-top:7px}.catalog-more[open]{padding-bottom:8px}

.auto-layout-result{display:flex;flex-wrap:wrap;gap:5px;align-items:center;flex:none;padding:7px 12px;border-top:1px solid #e5dfd4;border-bottom:1px solid #e5dfd4;background:#fffaf0}
.auto-layout-result>span{flex:1;min-width:180px;font:11px/1.5 var(--ui-font);color:#80652e}.auto-layout-result button{font-size:10px;padding:3px 6px;height:auto;min-height:24px}
.image-vault-status{font:10px/1.6 var(--ui-font);color:#65748a;margin:4px 0;flex:none}.image-vault-status.error{color:#b33d2f;background:#fff0eb;padding:5px;border-radius:4px}#imageVaultBtn{align-self:flex-start;font-size:10px;height:25px;padding:0 8px;margin:0 0 6px}.vault-location{font-size:11px;overflow-wrap:anywhere;background:#f3f5f8;padding:10px;border-radius:6px}.vault-count,.vault-message{font-size:12px;line-height:1.8}.studio-body .vault-message{background:#fff9e8;padding:12px;border-radius:8px}
#imagesPanel.image-dock{grid-template-rows:auto auto auto auto minmax(0,1fr)!important}#imagesPanel .image-collection{min-height:0;align-content:start;grid-auto-rows:max-content}#imagesPanel .image-item{height:92px!important;min-height:92px;aspect-ratio:auto!important;min-width:0}#imagesPanel .image-item img{object-fit:contain!important;background:#fff}.image-vault-status.warning{color:#91691f}
.workflow-media-row{border:1px solid #e1e5eb;border-radius:7px;padding:8px;background:#fafbfc}.workflow-media-strip{display:flex;gap:5px}.workflow-media-strip img{width:38px;height:34px;object-fit:contain;background:white;border:1px solid #eee;border-radius:3px}.workflow-media-row>small{grid-column:1/-1;color:#8b8e95;font-size:10px}
.component-tone-picker{display:flex;flex-wrap:wrap;gap:5px;padding:9px 10px;border-block:1px solid #e0e3e9;background:#fafbfc;position:sticky;top:0;z-index:1}.component-tone-picker>span{width:100%;font-size:10px;color:#858b95}.component-tone-picker button{padding:5px 7px;font-size:10px;border:1px solid #e1e4e9;border-radius:5px;background:white;color:#555;cursor:pointer}.component-tone-picker button:before{content:'';display:inline-block;width:6px;height:6px;background:var(--tone);border-radius:50%;margin-right:4px}.component-tone-picker button[aria-pressed=true]{border-color:var(--tone);box-shadow:0 0 0 1px var(--tone)}
#componentsPanel [data-component-section-tab=basic]{--category:#617EA4;--category-soft:#F1F5FB}#componentsPanel [data-component-section-tab=layout]{--category:#8B6BA1;--category-soft:#F7F1FA}#componentsPanel [data-component-section-tab=action]{--category:#AD8451;--category-soft:#FBF5EA}#componentsPanel [data-component-section-tab=custom]{--category:#67798C;--category-soft:#F0F4F7}
#componentsPanel .component-subtabs button[data-component-section-tab]{color:var(--category)!important;font-size:11px!important}#componentsPanel .component-subtabs button[data-component-section-tab].active{color:var(--category)!important;border-color:var(--category)!important;background:var(--category-soft)!important;box-shadow:0 2px 6px #22334409!important}#componentsPanel .component-subtabs button:before{background:var(--category)!important}
#componentsPanel [data-component-section=basic]{--category:#617EA4;--category-soft:#F1F5FB}#componentsPanel [data-component-section=layout]{--category:#8B6BA1;--category-soft:#F7F1FA}#componentsPanel [data-component-section=action]{--category:#AD8451;--category-soft:#FBF5EA}
#componentsPanel .library-section[data-component-section] button.component-card{border-left:3px solid var(--category,#67798C)!important;background:linear-gradient(115deg,#fff,var(--category-soft,#f7f8fa))!important}#componentsPanel .library-section .catalog-icon{color:var(--category,#67798C)!important}#componentsPanel .library-section>h3{color:var(--category,#67798C)!important}#componentsPanel .library-section>h3:before{background:var(--category,#67798C)!important}
/* A single browsing layout across all four categories; colour is the only category variation. */
#componentsPanel [data-component-section=custom]{--category:#67798C;--category-soft:#F0F4F7}
.library-panel#componentsPanel:before{display:none!important}
#componentsPanel .component-subtabs{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px!important;padding:5px 0!important;margin:0 0 10px!important;background:#F8FAFD!important;border:0!important;box-shadow:none!important;position:sticky!important;top:0;z-index:3}
#componentsPanel .component-subtabs button[data-component-section-tab]{height:34px!important;padding:0 6px!important;border-radius:7px!important;letter-spacing:0!important;font-size:12px!important;border:1px solid #E2E6EC!important;background:#FFF!important}
#componentsPanel .component-subtabs button:before{display:none!important}
#componentsPanel .component-subtabs button:focus-visible{outline:2px solid var(--category);outline-offset:2px}
#componentsPanel .library-section[data-component-section]:not(.component-section-hidden){display:block!important;padding:10px!important;margin:0!important;border-radius:9px!important;background:#FAFBFD!important;box-shadow:none!important;border:1px solid #E0E5EB!important}
#componentsPanel .library-section.component-section-hidden{display:none!important}
#componentsPanel .catalog-purpose{margin:0 0 10px!important;padding:0!important;font:10px/1.65 var(--ui-font);color:#7B8390;min-height:33px}
#componentsPanel .catalog-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:7px!important;padding:0;margin:0;align-content:start;min-width:0}
#componentsPanel .library-section .component-card{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;width:100%!important;max-width:100%!important;min-width:0!important;height:64px!important;min-height:64px!important;box-sizing:border-box!important;padding:10px 11px!important;margin:0!important;border-radius:8px!important;border:1px solid #E0E5EB!important;box-shadow:0 1px 2px #26344804!important;text-align:left!important;transition:border-color .16s,box-shadow .16s,transform .16s!important}
#componentsPanel .library-section .component-card:hover,#componentsPanel .library-section .component-card:focus-visible{border-color:var(--category)!important;box-shadow:0 3px 10px #2634480C!important;outline:none;transform:translateY(-1px)}
#componentsPanel .component-card:before,#componentsPanel .component-card:after{display:none!important}
#componentsPanel .component-card-top{display:block!important;min-width:0!important;flex:1!important;padding:0!important;line-height:1.5!important}
#componentsPanel .component-card-top b{display:block!important;font:600 13px/1.5 var(--ui-font)!important;color:#303944!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#componentsPanel .component-card-top small{display:block!important;font:10px/1.5 var(--ui-font)!important;color:#7B8593!important;text-decoration:none!important;margin:3px 0 0!important;white-space:nowrap}
#componentsPanel .component-card .catalog-icon{flex:0 0 28px!important;width:28px!important;height:28px!important;margin:0!important;padding:0!important;background:none!important;border:0!important;color:var(--category)!important}
#componentsPanel .catalog-icon svg{width:25px!important;height:25px!important}
#componentsPanel .catalog-more{display:block!important;grid-column:auto!important;margin:12px 0 0!important;padding:10px 0 0!important;border-top:1px solid #E1E5EC!important}
#componentsPanel .catalog-more summary{font:600 11px/1.7 var(--ui-font);color:var(--category);padding:0}
#componentsPanel .catalog-more[open] summary{margin-bottom:9px}
#componentsPanel .catalog-empty{padding:18px 12px;background:white;border:1px dashed #D6DDE6;border-radius:8px;color:#7B8593;font:11px/1.8 var(--ui-font);margin:0}
#componentsPanel .studio-components:empty{display:none!important}
#componentsPanel .studio-components:not(:empty){margin-top:7px}
#componentModal .modal-box{height:min(700px,90vh);padding:22px!important;gap:0}
#componentModalTitle{margin:0 34px 6px 0!important;font-size:20px!important}
#componentModalCopy{margin:0 0 8px!important;font-size:12px;line-height:1.7;color:#7B8390}
#componentVariants.component-choice-layout{flex:1;min-height:0!important;max-height:none!important;margin:8px 0 14px!important;gap:16px!important;grid-template-columns:220px minmax(0,1fr)!important}
#componentModal .component-choice-list .variant-card{border:1px solid #E1E5EB!important;border-radius:8px!important;background:#FFF!important;color:#343B44!important;box-shadow:none!important;padding:11px 12px!important;min-height:65px!important}
#componentModal .component-choice-list .variant-card.active{background:#FFFBF2!important;border-color:#D6AE57!important;box-shadow:inset 3px 0 #FFBA32!important}
#componentModal .component-choice-list .variant-card:focus-visible{outline:2px solid #D6AE57;outline-offset:1px}
#componentModal .component-choice-stage{background:#F1F3F6;border-color:#E1E5EB}
#componentModal .component-real-preview{min-height:200px;margin:14px auto 20px;box-shadow:0 2px 8px #27344307}
.heading-portrait-picker{display:flex;align-items:center;gap:7px;padding:8px 12px;background:#FAFBFC;border-bottom:1px solid #E1E5EB}
.heading-portrait-picker[hidden]{display:none}
.heading-portrait-picker>span{font:10px var(--ui-font);color:#7B8390;margin-right:5px}
.heading-portrait-picker button{width:35px;height:35px;padding:3px;border:1px solid #DFE3E9;background:#FFF;border-radius:7px;cursor:pointer}
.heading-portrait-picker button[aria-pressed=true]{border-color:#C69536;background:#FFF6DE}
.heading-portrait-picker img{width:100%;height:100%;object-fit:contain}
@media(max-width:680px){#componentVariants.component-choice-layout{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:150px minmax(0,1fr)}#componentModal .component-choice-list{overflow:auto!important}.component-real-preview{max-width:100%}}
@media(prefers-reduced-motion:reduce){#componentsPanel .component-card{transition:none!important;transform:none!important}}
/* Editorial workbench: context controls belong to the toolbar, never to copied content. */
.editing-context{flex:none;display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:9px 14px;background:#f6f7fa;border-bottom:1px solid #dce1e9;min-height:43px;box-shadow:0 3px 8px #18294605}
.editing-context .context-label{font-size:11px;font-weight:700;color:#4c5870;padding-right:8px;border-right:1px solid #dce1e9}
.editing-context small{font-size:11px;color:#7a8190;line-height:1.5}.editing-context select{max-width:154px;height:29px;background:white;border:1px solid #dce1e9;border-radius:6px;font-size:11px;color:#4a5364}
.editing-context .small-button{min-height:28px;padding:4px 8px;font-size:11px;border-radius:6px}.editing-context button:hover{background:#fff3d9;border-color:#dfc17e}
.workspace-modal{width:min(840px,calc(100vw - 36px));max-height:86vh;display:flex;flex-direction:column;padding:24px!important;background:#fafbfc}.workspace-modal>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.workspace-modal h2{margin:0;font-size:20px}.workspace-body{min-height:0;overflow:auto;overscroll-behavior:contain;padding:4px 3px;flex:1}.workspace-actions{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 14px}.workspace-draft{border:1px solid #e1e5eb;background:white;border-radius:12px;padding:16px;margin-bottom:12px}.workspace-draft h3{font-size:15px;margin:0 0 8px}.workspace-draft small{font-size:11px;color:#7a8390}.workspace-draft .workspace-actions{margin-bottom:0}.workspace-message{font-size:12px;color:#687386;margin:8px 0 0}.workspace-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.workspace-form label,.workspace-body>label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#556071}.workspace-form label:last-child{grid-column:1/-1}.workspace-form input,.workspace-form textarea,.workspace-body select{border:1px solid #dce1e9;border-radius:7px;background:white;padding:9px;font:inherit;color:#293344}.workspace-form textarea{min-height:90px}.release-issue{padding:12px 15px;background:white;border:1px solid #e3e6ec;border-left:3px solid #d1a053;border-radius:8px;margin:10px 0}.release-issue.block{border-left-color:#c44d42}.release-issue p{font-size:13px;line-height:1.7;margin:0 0 9px}.template-recommend-button{margin:0 0 14px;width:100%;text-align:left}.recipe-recommendations{display:grid;gap:12px}.recipe-recommendations>section{border:1px solid #e4e6eb;background:white;padding:16px;border-radius:10px}.recipe-recommendations h3{font-size:15px;margin:0 0 8px}.recipe-recommendations p{font-size:12px;color:#77808e;line-height:1.7;margin:0 0 12px}
.component-rgba-input{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(74px,1.4fr);gap:7px;border-top:1px solid #e5e7eb;padding-top:12px;margin-top:12px}.component-rgba-input label{font-size:10px;color:#687386;min-width:0}.component-rgba-input input{width:100%;min-width:0;box-sizing:border-box;padding:6px 4px;border:1px solid #d8dfe9;border-radius:5px;font-size:12px}.component-rgba-input button{grid-column:span 2}#componentColorPopover{max-height:calc(100vh - 180px);overflow-y:auto}
.guide-capsule-example{max-width:390px;margin:18px auto;padding:16px;background:#faf8f3;border:1px solid #eee7d8;border-radius:18px;font-weight:400;pointer-events:none}
.guide-capsule-example img{max-width:100%}
.guide-progress{gap:6px;grid-template-columns:repeat(8,minmax(0,1fr))}
.guide-modal{max-height:92vh;display:flex;flex-direction:column}
.guide-pages{overflow-y:auto;min-height:0!important;overscroll-behavior:contain}
.guide-head,.guide-progress,.guide-footer{flex-shrink:0}
/* Logical device dimensions stay stable; a small panel scales the device, not the typesetting. */
.preview-body.tablet-scene .device-mock.tablet{width:768px!important;height:576px!important;min-height:0!important;max-height:none!important;max-width:none!important;transform:translate(-50%,-50%) scale(var(--wide-preview-scale,1))!important;transform-origin:center!important}
.preview-body.desktop-scene .device-mock.desktop{width:960px!important;height:600px!important;min-height:0!important;max-height:none!important;max-width:none!important;transform:translate(-50%,-50%) scale(var(--wide-preview-scale,1))!important;transform-origin:center!important}
.preview-body.tablet-scene .device-mock.tablet .paper{padding:36px 90px 56px!important;width:100%!important;height:100%!important;max-width:none!important;min-height:0!important;overflow:auto!important;display:block!important;overscroll-behavior:contain}
.preview-body.desktop-scene .device-mock.desktop .paper{padding:36px 126px 60px!important;display:block!important;overscroll-behavior:contain}
.device-mock.desktop .paper .render{display:block!important}
.device-mock.desktop .paper .render>*{order:initial!important;flex-shrink:0}
.device-mock.desktop .browser-address{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* editor-finish.css */
/* Shared surfaces and control states; no article-style overrides. */
.library{border:1px solid #d9e0e9!important;border-top:3px solid #7394c2!important;border-radius:13px!important;background:#f8fafd!important;box-shadow:0 4px 18px #26344806!important}
.library.templates-view{border-top-color:#9670a8!important}
.image-dock{border:1px solid #d9e0e9!important;border-top:3px solid #8b96a7!important;border-radius:13px!important;box-shadow:0 4px 18px #26344806!important}
.editor-side{border:1px solid #d7dfe8!important;border-top:3px solid #e6b34e!important;border-radius:13px!important;overflow:hidden}
.preview-side{border:1px solid #d9e0e9!important;border-top:3px solid #91a0b4!important;border-radius:13px!important;overflow:hidden}


.editor-side .panel-bar,.preview-side .panel-bar{border-top:0!important;flex-shrink:0}

.preview-controls button:focus-visible{outline:2px solid #ae8540;outline-offset:2px}
#componentsPanel .library-section .component-card{border-width:2px!important;border-left-width:3px!important}
#componentModal .component-choice-list .variant-card{border-width:2px!important}
#componentModal .component-choice-list .variant-card.active{border-width:2px!important}
.component-style-control.border-width-control{grid-template-columns:72px minmax(0,1fr) 54px 16px!important;gap:6px!important}
.border-width-control input[type=number]{min-width:0;width:54px;padding:5px 3px;border:1px solid #d9e0e9;border-radius:5px;font-size:12px;color:#354357}
.storage-meter{padding:18px;border:1px solid #e1e5ec;border-radius:10px;background:#fff;font-size:13px;line-height:1.9}
.preview-controls{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end}
.device-mock.frame-hidden .device-frame{visibility:hidden!important}.device-mock.frame-hidden{background:transparent!important;box-shadow:none!important}
.device-mock.frame-hidden:after{display:none!important}
/* Device chrome surrounds, rather than overlays, the 390px article viewport.
   The fixed pixel screen radius is independent of article/scroll height. */
#previewBody #deviceMock.phone{position:absolute!important;top:50%!important;left:50%!important;width:410px!important;height:850px!important;max-width:none!important;max-height:none!important;min-height:0!important;flex:0 0 410px!important;margin:0!important;padding:0!important;transform:translate(-50%,-50%) scale(var(--phone-preview-scale,1))!important;transform-origin:center!important;background:transparent!important;border:0!important;border-radius:72px!important;clip-path:none!important;overflow:visible!important;transition:none!important;animation:none!important}
#previewBody #deviceMock.phone .paper{position:absolute!important;inset:10px!important;width:390px!important;height:830px!important;max-width:none!important;min-height:0!important;box-sizing:border-box!important;margin:0!important;padding:35px 20px 44px!important;border:0!important;border-radius:64px!important;overflow:auto!important;overscroll-behavior:contain;scrollbar-width:none!important;clip-path:inset(0 round 64px)}
#previewBody #deviceMock.phone:after{clip-path:inset(0 round 72px);border-radius:72px}
#previewBody #deviceMock.phone.frame-hidden .paper{border-radius:12px!important;clip-path:none;box-shadow:0 8px 30px #26374b14!important}
/* Resolve size in the same layout pass as the preview container. Older browsers
   retain the ResizeObserver fallback; modern ones never paint a stale scale. */
@supports (transform:scale(calc(1px / 1px))){
  #previewBody{container-type:size}
  #previewBody #deviceMock.phone{--phone-preview-scale:min(1,calc((100cqw - 8px) / 410px),calc((100cqh - 8px) / 850px))!important}
}
@media(min-width:801px){.layout{min-height:0!important}.preview-body{min-height:0!important}}
#previewSide.preview-expanded{position:fixed!important;inset:16px!important;z-index:1800!important;width:auto!important;height:auto!important;display:flex!important;flex-direction:column!important;box-shadow:0 0 0 100vmax #1c263c88!important}
#previewSide.preview-expanded .preview-body{flex:1;min-height:0}
.release-summary{padding:14px 16px;margin-bottom:14px;border:1px solid #e7d8b9;border-radius:10px;background:#fffbf2;color:#635238;font:12px/1.8 var(--ui-font)}.release-summary h3{font-size:14px;margin:0 0 8px}.release-summary p{margin:6px 0}
.manual-copy-modal .workspace-body{background:#f5f7fa}.manual-copy-content{width:390px;max-width:100%;padding:25px 20px 34px;margin:12px auto;box-sizing:border-box;background:white;color:#333;user-select:text;overflow-wrap:anywhere;border-radius:8px;box-shadow:0 4px 18px #26374b0c}.manual-copy-content:focus{outline:2px solid #ffba32;outline-offset:2px}
/* Tutorial layout is owned by editor-guide.css. */

/* Operator workbench: quieter chrome, explicit reading order, restrained motion.
   These rules never target #editor contents or #preview article typography. */
:root{--surface-line:#dce2e9;--surface-ink:#303947;--surface-muted:#778292;--motion-fast:160ms;--motion-panel:200ms}
.top{background:linear-gradient(110deg,#ffffff 65%,#fffbf2)!important;border-bottom:1px solid var(--surface-line)!important;box-shadow:0 2px 10px #27344304!important}
.top .button:not(.primary){background:#fff!important;border-color:#dce2e9!important;color:#556174!important;font-weight:500;box-shadow:0 1px 2px #27344304!important}
.top .button.primary{box-shadow:0 3px 9px #be8a1820!important}
.top .guide-button i{background:#586a83!important}
.top button,.tabs .tab,.small-button,.preview-controls button{transition:background-color var(--motion-fast),border-color var(--motion-fast),box-shadow var(--motion-fast),color var(--motion-fast)}
.top button:hover{box-shadow:0 3px 10px #27344312!important}
.library .library-head{background:#fff!important}.library .library-copy{color:#7b8593!important;font-size:11px!important;line-height:1.7}
.library .tabs{background:#f5f7fb!important;border-top:1px solid #edf0f4!important;border-bottom:1px solid #e1e6ee!important}



.editor-side .editing-context{background:#fffcf5;border-top:1px solid #f0e8d6;border-bottom:1px solid #e8e3d7}
.preview-side .panel-bar,.editor-side .panel-bar{background:#fff!important}
.image-dock{background:#f4f6f9!important}.image-dock-head{padding-bottom:9px!important;border-bottom:1px solid #dfe4ec!important}
.modal.open>.modal-box{animation:workbench-modal-in var(--motion-panel) ease-out}
.library-panel:not(.hidden){animation:workbench-panel-in var(--motion-panel) ease-out}
@keyframes workbench-modal-in{from{opacity:0;translate:0 7px}to{opacity:1;translate:0 0}}
@keyframes workbench-panel-in{from{opacity:.65}to{opacity:1}}
.recipe-family-tabs,.recipe-preview-switch,.structure-filters{display:flex;gap:5px;flex-wrap:wrap;flex:none;padding:5px;background:#edf0f5;border:1px solid #e2e6ed;border-radius:9px}
.recipe-family-tabs{margin:0 0 12px;position:sticky;top:0;z-index:3;gap:3px}
.recipe-family-tabs button,.recipe-preview-switch button,.structure-filters button{border:1px solid transparent;background:transparent;border-radius:6px;padding:7px 10px;font:500 12px var(--ui-font);color:#687589;cursor:pointer;transition:background var(--motion-fast),box-shadow var(--motion-fast),color var(--motion-fast)}
.recipe-family-tabs button{flex:1;padding:6px 2px;font-size:11px;min-width:0}
.recipe-family-tabs [aria-pressed=true],.recipe-preview-switch [aria-pressed=true],.structure-filters [aria-pressed=true]{background:#fff;border-color:#dfe4eb;color:#303b4d;box-shadow:0 2px 5px #24354e09}
.recipe-family-tabs button:focus-visible,.recipe-preview-switch button:focus-visible,.structure-filters button:focus-visible{outline:2px solid #aa8644;outline-offset:1px}
#templatesPanel .recipe-row{border:1.5px solid #dfe3e9!important;border-left:3px solid #bd9b58!important;border-radius:9px!important;gap:9px;transition:border-color var(--motion-fast),box-shadow var(--motion-fast)}
#templatesPanel .recipe-row:hover{border-color:#bca477!important;box-shadow:0 3px 10px #24354e08}
#templatesPanel .recipe-row[hidden]{display:none!important}
#templatesPanel [data-recipe-family=knowledge]{border-left-color:#7996bc!important}
#templatesPanel [data-recipe-family=story]{border-left-color:#9f85ad!important}
#templatesPanel [data-recipe-family=visual]{border-left-color:#8b989d!important}
#templatesPanel .recipe-row-copy>b{font-size:12px;line-height:1.55}
.recipe-sample-modal .studio-modal{height:min(840px,91vh);max-height:91vh;width:min(700px,94vw)}
.recipe-sample-modal .studio-body{display:flex;flex-direction:column;flex:1;overflow:hidden}
.recipe-sample-modal .studio-hint{flex:none;margin:0 0 12px}
.recipe-sample-stage{flex:1;overflow:auto;overscroll-behavior:contain;min-height:0;margin-top:12px;background:#edf0f3;border:1px solid #e0e5eb;border-radius:10px}
.recipe-sample-stage .studio-sample-paper{width:390px;max-width:100%;margin:18px auto;padding:25px 20px;border:0;box-shadow:0 4px 20px #1d30460b}
.recipe-edit-preview{margin-top:16px;padding:12px;background:#f0f3f6;border:1px solid #dfe5eb;border-radius:9px}
.recipe-edit-preview summary{cursor:pointer;font-size:12px;color:#526177}
.structure-box{background:#f7f8fa!important;gap:10px}
.structure-box>header{padding-bottom:12px;border-bottom:1px solid #e1e5eb}
.structure-box .structure-tools{flex-wrap:wrap}
.structure-columns{gap:18px;grid-template-columns:minmax(0,1fr) 390px}
.structure-row{grid-template-columns:18px minmax(0,1fr) 120px;align-items:start;padding:14px 12px;border-left:3px solid #819ab9;box-shadow:0 1px 3px #27344304}
.structure-row[data-content-type=media]{border-left-color:#9c84ad}
.structure-row[data-content-type=group]{border-left-color:#c29c51}
.structure-row input[type=checkbox]{accent-color:#a38345;margin-top:6px}
.structure-row .structure-order{display:block;font:600 10px/1.4 var(--ui-font);letter-spacing:.5px;color:#7b8899;margin:0 0 8px}
.structure-row b{font-size:13px;line-height:1.75;-webkit-line-clamp:3;color:#364151;font-weight:400}
.structure-row small{line-height:1.6;color:#8892a0;margin-top:6px}
.structure-row select{padding:7px 5px;background:#f8f9fb;font-size:11px}
.structure-row .workflow-media-strip{margin-bottom:10px;padding:10px;background:#f3f4f7;border-radius:7px}
.structure-row .workflow-media-strip img{width:88px;height:66px;border:0;border-radius:4px}
.structure-message{min-height:17px;margin:0;font:11px/1.6 var(--ui-font);color:#7a6a4c}
.structure-empty{padding:24px 16px;border:1px dashed #d8dfe8;border-radius:9px;color:#8490a0;font:12px/1.8 var(--ui-font);background:#fff}
.structure-live article{min-height:calc(100% - 36px)}
@media(max-width:850px){.structure-columns{grid-template-columns:minmax(0,1fr)}.structure-box{padding:16px!important}.structure-row{grid-template-columns:16px minmax(0,1fr) 104px}.structure-row select{font-size:10px}}
@media(prefers-reduced-motion:reduce){.top button,.tabs .tab,.small-button,.preview-controls button,.recipe-family-tabs button,.recipe-preview-switch button,.structure-filters button,#templatesPanel .recipe-row{transition:none!important}.modal.open>.modal-box,.library-panel:not(.hidden){animation:none!important}}

/* editor-experience.css */
/* Quiet, consistent control surfaces. Article typography is intentionally untouched. */
/* Match the previous raster wordmark's visible type height; retain the supplied 24px mark. */
.top .editor-brand{flex:none;gap:8px;white-space:nowrap}
.top .editor-brand-mark{display:block;flex:none;width:24px;height:24px;object-fit:contain}
.top .editor-brand-title{display:block;color:#202020;font:700 16px/24px "Microsoft YaHei","PingFang SC",sans-serif;letter-spacing:0}
.library .library-copy,.library-panel#componentsPanel:before,.library-panel#templatesPanel:before{display:none!important}
.library-head{padding:13px 14px!important}.library-title h2{font-size:15px!important}
.editor-side .panel-bar{height:auto!important;min-height:59px;gap:10px;padding:8px 14px!important}
.editor-side .panel-bar>strong{font-size:15px;color:#344152;flex:none}.editor-side .panel-bar>strong:after{display:none!important}
.draft-identity{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}
.draft-name{display:block;width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:0;padding:0;text-align:left;background:transparent;color:#344152;font:600 13px var(--ui-font);cursor:pointer}
.draft-name:hover{color:#98702e}.draft-recipe{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:10px var(--ui-font);color:#8490a0}
.editor-side .panel-bar #editorState{display:none}.editor-side .apply-template-button{flex:none;font-size:10px}
#saveStatus{font-size:11px;color:#778395!important;white-space:nowrap}#saveStatus[data-state=error]{color:#b42318!important}#saveStatus[data-state=pending]{color:#8c6a29!important}
.top #saveStatus{background:#f0f3f7!important}.top #saveStatus[data-state=error]{background:#ffebe7!important}.top #saveStatus[data-state=pending]{background:#fff5e0!important}
.storage-conflict{padding:10px 13px;display:flex;flex-wrap:wrap;gap:7px;background:#fff1ee;border-bottom:1px solid #e9c1b9;flex:none;font:11px/1.7 var(--ui-font);color:#8e3526}
.storage-conflict[hidden]{display:none}.storage-conflict section{width:100%}.storage-conflict p{margin:3px 0}
.image-dock{display:flex!important;flex-direction:column!important;gap:9px;padding:12px!important;min-height:0!important;overflow:hidden!important}
.image-dock>.library-tip{display:none!important}.image-dock .image-vault-status{font:11px/1.6 var(--ui-font);margin:0;flex:none}.image-vault-status[hidden]{display:none!important}
.vault-controls{display:grid;grid-template-columns:minmax(0,1fr) 116px 40px;gap:5px;flex:none}.vault-controls input,.vault-controls select,.vault-batch select{height:29px;width:100%;min-width:0;background:white;border:1px solid #dbe1e9;border-radius:6px;padding:0 6px;font:11px var(--ui-font);color:#576579}.vault-controls input::placeholder{color:#929cab}.vault-controls button{padding:0!important;font-size:10px!important}
.image-dock .image-category{width:100%;min-width:0;height:26px;margin-top:4px;padding:0 4px;background:#f5f7fa;border:1px solid #e4e9ef;border-radius:5px;color:#68778b;font:11px var(--ui-font);cursor:pointer}
.vault-rules{padding:12px 14px;margin:12px 0;background:#f6f8fb;border:1px solid #e0e6ee;border-radius:9px;font:12px/1.8 var(--ui-font);color:#576579}.vault-rules summary{cursor:pointer;font-weight:600}.vault-rules ul{margin:10px 0 0;padding-left:20px}.vault-rules li+li{margin-top:7px}
.vault-batch{display:flex;flex-wrap:wrap;align-items:center;gap:5px;flex:none;padding:8px;background:#eaf0f6;border-radius:7px;font:10px var(--ui-font);color:#5f7188}.vault-batch[hidden]{display:none!important}.vault-batch select{width:104px}.vault-batch button{font-size:10px!important}.vault-batch [data-count]{margin-right:auto}
.image-dock .image-collection{flex:1;min-height:0!important;height:0!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-rows:max-content!important;align-content:start!important;gap:10px!important;margin:0!important;padding:2px 4px 8px 0!important;border:0!important;overflow-y:auto!important;overscroll-behavior:contain;scrollbar-color:#b5c0ce transparent!important}
.image-dock .image-item{height:auto!important;min-height:0!important;display:flex!important;flex-direction:column!important;aspect-ratio:auto!important;background:#fff!important;border:1.5px solid #dce3ec!important;border-radius:9px!important;padding:6px!important;box-shadow:0 2px 5px #253e5705;overflow:hidden!important;position:relative;transition:border-color 160ms,box-shadow 160ms}
#imagesPanel.image-dock .image-item{height:auto!important;min-height:0!important;max-height:none!important}
.image-dock .image-name{flex:none!important}
.image-dock .image-item:hover{border-color:#9cabbe!important;box-shadow:0 4px 10px #253e5710}.image-dock .image-item.selected{border-color:#b48c44!important;box-shadow:0 0 0 1px #b48c44}
.image-dock .image-item img{display:block!important;aspect-ratio:4/3!important;width:100%!important;height:auto!important;object-fit:contain!important;background:#f4f6f9!important;border-radius:5px;cursor:pointer}
.image-dock .image-name{position:static!important;display:block!important;background:none!important;color:#627184!important;font:11px/1.5 var(--ui-font)!important;padding:7px 0 1px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:16px}
.image-dock .image-item button{width:22px!important;height:22px!important;top:7px!important;right:7px!important;border:1px solid #dbe1e9!important;background:#ffffffed!important;color:#697a90!important;border-radius:5px!important;font-size:14px!important;opacity:0;transition:opacity 160ms}.image-dock .image-item .rename-image{right:33px!important}.image-dock .image-item:hover button,.image-dock .image-item:focus-within button{opacity:1}
.image-dock .vault-select{position:absolute;top:10px;left:9px;width:16px;height:16px;accent-color:#a6813d}.image-dock .image-collection>.library-tip{grid-column:1/-1;padding:18px 8px!important;border:0!important;text-align:center;line-height:1.8!important}
.structure-sequential .structure-box{width:min(1120px,96vw)!important;max-width:1120px!important;padding:24px!important}
.structure-sequential .structure-columns{grid-template-columns:minmax(0,1fr) 360px;gap:16px}
.structure-sequential .structure-rows{display:flex;overflow:hidden;padding:0;min-height:0}
.structure-sequence{display:flex;flex-direction:column;min-height:0;min-width:0;width:100%;border:1px solid #dce3ec;border-top:3px solid #819ab9;background:white;border-radius:12px;overflow:hidden}
.structure-sequence>header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#f6f8fb;border-bottom:1px solid #e0e5ec;flex:none}.structure-sequence h3{margin:0;font:600 13px var(--ui-font);color:#45576e}.structure-sequence>header>span{font:11px var(--ui-font);color:#8994a4}
.structure-sequence-list{overflow:auto;min-height:0;flex:1;padding:0 16px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#bcc5d3 transparent}
.structure-sequential .structure-row{grid-template-columns:18px minmax(0,1fr) 116px;gap:12px;padding:16px 0;margin:0;border:0;border-bottom:1px solid #e9edf2;border-radius:0;box-shadow:none;transition:background 160ms}
.structure-sequential .structure-row:last-child{border-bottom:0}.structure-sequential .structure-row.is-selected{background:#fff9eb;box-shadow:16px 0 #fff9eb,-16px 0 #fff9eb}
.structure-sequential .structure-row select{font-size:11px;margin-top:2px}.structure-sequential .structure-row b{font-size:12px}.structure-sequential .structure-row small{font-size:10px}.structure-sequential .structure-live article{padding:24px 18px}
.structure-sequential .structure-order{margin-bottom:5px;color:#617b9d}.structure-sequential [data-content-type=media] .structure-order{color:#8c6da0}.structure-sequential [data-content-type=group] .structure-order{color:#a07a38}
.structure-sequential .workflow-media-strip{padding:0;background:none;margin:0 0 8px;flex-wrap:wrap}.structure-sequential .workflow-media-strip img{width:88px;height:70px;object-fit:contain;border:1px solid #e7eaf0;background:#f8f9fb}
.structure-sequential .structure-tools{border:1px solid #e0e5ed;background:#eef2f7;border-radius:9px;padding:10px 12px;gap:6px}.structure-sequential .structure-tools>span{margin-right:auto}.structure-sequential button:disabled{opacity:.45;cursor:not-allowed}.structure-sequential .structure-join-next{font-size:10px;margin-top:8px}
.legacy-history{border:1px solid #e1e6ed;border-radius:9px;padding:12px;margin-top:16px}.legacy-history summary{font-size:12px;color:#788395;cursor:pointer}
.modal-box button:focus-visible,.modal-box select:focus-visible,.modal-box input:focus-visible,.vault-controls input:focus-visible,.draft-name:focus-visible{outline:2px solid #b08c4a;outline-offset:2px}
@media(max-width:1080px){.vault-controls{grid-template-columns:minmax(0,1fr) 76px 36px}}
@media(max-width:850px){.structure-sequential .structure-columns{grid-template-columns:minmax(0,1fr)}.structure-sequential .structure-live{display:none}}
@media(max-width:600px){.structure-sequential .structure-row{grid-template-columns:18px minmax(0,1fr)}.structure-sequential .structure-row select{grid-column:2;max-width:160px}.draft-recipe{display:none}}
@media(hover:none){.image-dock .image-item button{opacity:1}}
@media(prefers-reduced-motion:reduce){.image-dock .image-item,.image-dock .image-item button{transition:none}}
/* Shared 4/8/12/16/24 rhythm. These styles never change article geometry. */
@media(min-width:1100px){.layout{grid-template-columns:clamp(280px,20vw,340px) minmax(440px,1.06fr) minmax(350px,1fr)!important;gap:12px!important;justify-content:stretch!important}}
.layout{background:#edf0f5!important}.library,.editor-side,.preview-side{border-radius:14px!important;box-shadow:0 3px 14px #293a5205!important}
.library{--image-dock-height:clamp(260px,32vh,340px);grid-template-rows:auto auto minmax(0,1fr) var(--image-dock-height)!important;border:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important}.editor-side{border-color:#dce2ea!important;border-top-color:#FFBA32!important}.preview-side{border-color:#d8dfe9!important;border-top-color:#91a0b4!important}
.library .library-head{border:1px solid #d8e0eb!important;border-top:3px solid #7394c2!important;border-bottom:0!important;border-radius:14px 14px 0 0!important}.library.templates-view .library-head{border-top-color:#9670a8!important}
.library .tabs{border-left:1px solid #d8e0eb!important;border-right:1px solid #d8e0eb!important}
.library #componentsPanel,.library #templatesPanel{max-height:none!important;height:100%!important;border:1px solid #d8e0eb!important;border-top:0!important;border-radius:0 0 14px 14px!important}
.library:has(.vault-batch:not([hidden])),.library:has(.image-vault-status:not([hidden])){--image-dock-height:330px}.library.gallery-collapsed,.library.gallery-collapsed:has(.vault-batch){--image-dock-height:64px}
.library:not(.gallery-collapsed):has(.vault-batch:not([hidden])):has(.image-vault-status:not([hidden])){--image-dock-height:380px}
.library-head{padding:12px 14px!important}.library .tabs{padding:8px 10px!important;gap:8px!important}.library .tab{border-radius:8px!important}
/* The category header is outside the clipped list, not a sticky overlay. */
.library #componentsPanel{overflow:hidden!important;scrollbar-gutter:auto!important;padding:0!important;min-height:0!important}
.library #componentsPanel:not(.hidden){display:flex!important;flex-direction:column!important}
#componentsPanel .component-subtabs{position:static!important;flex:none!important;gap:6px!important;margin:0!important;padding:10px 12px!important;background:#f8fafd!important;border:0!important;border-bottom:1px solid #e5e9f0!important;border-radius:0!important;z-index:auto!important;width:100%;min-width:0;box-sizing:border-box}
#componentsPanel .component-list-viewport{flex:1 1 auto;min-height:0;min-width:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#aeb9ca transparent;padding:8px 6px 12px 12px;background:#f8fafd}
#componentsPanel .component-list-viewport::-webkit-scrollbar{width:8px}
#componentsPanel .component-list-viewport::-webkit-scrollbar-thumb{border:2px solid #f8fafd;border-radius:10px;background:#aeb9ca}
#componentsPanel .component-list-viewport::-webkit-scrollbar-track{background:#f8fafd}
#componentsPanel .catalog-purpose{min-height:0!important;font-size:10px;margin-bottom:10px!important;line-height:1.6}
#componentsPanel .library-section[data-component-section]:not(.component-section-hidden){padding:10px!important;border-radius:10px!important;border-color:#dce2eb!important;background:#f8fafd!important}
#componentsPanel .library-section .component-card{height:48px!important;min-height:48px!important;padding:8px 12px!important;border-width:2px!important;border-radius:8px!important;background:#fff!important;margin:4px 0!important;box-shadow:none!important}
#componentsPanel .library-section[data-component-section] button.component-card{background:#fff!important;border-width:2px!important;border-left-width:3px!important;border-color:#dfe5ed!important;border-left-color:var(--category)!important}
#componentsPanel .component-card-top b{font-size:13px!important}#componentsPanel .component-card-top small{display:none!important}.catalog-more summary{cursor:pointer}
#templatesPanel .official-template-head>span{display:none!important}.recipe-family-tabs{padding:4px!important;margin-bottom:12px!important}.recipe-family-tabs button{padding:6px 3px!important}
#templatesPanel .recipe-row{padding:10px!important;gap:8px!important;border-radius:10px!important;background:white!important}
#templatesPanel .recipe-row-copy>b{font-size:12px!important;line-height:1.6}.recipe-row-copy>span{min-height:0!important;margin:4px 0 8px!important}
#templatesPanel .recipe-row .template-actions{display:flex!important;flex-wrap:nowrap!important;gap:4px!important}#templatesPanel .recipe-row .template-actions>button{padding:0 2px!important;font-size:10px!important;min-width:0!important}
#templatesPanel .recipe-more{margin:0!important;flex:none!important}#templatesPanel .recipe-more summary{padding:0!important;width:16px;text-align:center}#templatesPanel .recipe-thumbnail{width:54px!important;height:88px!important}#templatesPanel .recipe-thumbnail>section{transform:scale(.15)!important}
#componentModal .modal-box{width:min(800px,94vw)!important;border-radius:16px!important}
#componentVariants.component-choice-layout{grid-template-columns:240px minmax(0,1fr)!important;gap:16px!important}
#componentModal .component-choice-list .variant-card{display:flex!important;flex-direction:column;gap:5px!important;min-height:72px!important}
#componentModal .component-choice-list .variant-card[hidden]{display:none!important}
#componentModal .component-choice-list .variant-card b{font-size:12px;line-height:1.7}#componentModal .component-choice-list .variant-card small{font-size:11px;line-height:1.7;color:#7a8594}
#componentModal .component-choice-stage{border-radius:10px}.component-choice-archive{margin-top:16px;border-top:1px solid #dfe4eb;padding-top:12px}.component-choice-archive summary{font-size:11px;line-height:1.8;color:#7a8594;cursor:pointer;margin-bottom:10px}
.component-variant-search{width:100%;height:34px!important;margin-bottom:12px!important;border-radius:7px!important}


.editor-side .editing-context[data-idle=true]{display:none!important}.image-dock{border:1px solid #d3dce8!important;border-top:3px solid #8e9aae!important;border-radius:14px!important;background:#f3f5f8!important}
.image-dock .image-item{border-radius:10px!important;padding:7px!important}.image-dock .image-collection{gap:12px!important}
@media(max-width:680px){#componentVariants.component-choice-layout{grid-template-columns:minmax(0,1fr)!important}}
@media(prefers-reduced-motion:reduce){.structure-sequential .structure-row{transition:none}}

/* One ordered sheet, not separate text/image cards or a competing preview pane. */
.structure-sequential .structure-box{width:min(920px,96vw)!important;max-width:920px!important;gap:12px}
.structure-sequential .structure-columns{display:flex;min-height:0;flex:1}
.structure-sequential .structure-rows{width:100%;flex:1}
.structure-sequential .structure-live{display:none!important}
.structure-sequential .structure-help{font-size:12px;line-height:1.7;color:#68768a;margin:0 0 4px}
.structure-sequential .structure-row{grid-template-columns:18px minmax(0,1fr) 138px;padding:18px 0;gap:16px;align-items:start}
.structure-sequential .structure-row b{font-size:13px;line-height:1.85;font-weight:400;color:#38475a}
.structure-sequential .structure-row small[hidden]{display:none!important}
.structure-sequential .structure-order{display:block;font-size:11px;letter-spacing:.5px;font-weight:600;margin-bottom:8px}
.structure-row-controls{display:flex;flex-direction:column;gap:8px;min-width:0}
.structure-sequential .structure-row-controls select{width:100%;max-width:100%;height:32px;font-size:12px;background:#f7f9fc;border:1px solid #dce3ed;border-radius:7px;padding:0 8px}
.structure-sequential .structure-row input[type=checkbox]{width:16px;height:16px;margin-top:4px;accent-color:#937029}
.structure-sequential .workflow-media-strip{margin:0 0 6px}
.structure-sequential .workflow-media-strip img{width:156px;height:102px;border-radius:7px;background:#f4f6f9}
.structure-sequential .structure-image-name{font-size:11px!important;color:#7c8797!important}
.structure-sequential .structure-tools{background:#f4f6fa;padding:10px;flex-wrap:wrap}
.structure-sequential .structure-sequence>header{background:#f8f9fc;padding:12px 16px}
.structure-sequential .structure-sequence{border-top-color:#FFBA32}
.structure-sequential .structure-box footer{padding-top:14px;border-top:1px solid #e3e7ef}
.structure-sequential .structure-message{min-height:18px;margin:0;font-size:11px}
/* The workbench has opaque reading surfaces; only shadows use transparency. */
.top{background:linear-gradient(108deg,#F1F2FF 0%,#F7F5FF 44%,#FFF8ED 100%)!important;border-bottom:1px solid #dddfea!important;box-shadow:0 2px 8px #283c5008!important}
.library-head,.preview-side .panel-bar{background:#f6f8fc!important}
.editor-side .panel-bar{background:#fffaf0!important}

.library .tabs{background:#f8fafd!important;border-bottom:1px solid #e0e5ed}
.library .tab{font-size:13px!important;transition:background-color 160ms,border-color 160ms,box-shadow 160ms}
.library .tab:focus-visible,.recipe-thumbnail:focus-visible,.component-card:focus-visible{outline:2px solid #8c729f;outline-offset:2px}
#templatesPanel .recipe-row{min-height:92px!important;align-items:center!important;border:1.5px solid #e0daeb!important;box-shadow:0 2px 6px #35465e04;transition:border-color 160ms,box-shadow 160ms}
#templatesPanel .recipe-row:hover{border-color:#aa96c1!important;box-shadow:0 4px 12px #5740670d}
#templatesPanel .recipe-row-copy{display:flex;flex-direction:column;justify-content:center;gap:10px;min-width:0}
#templatesPanel .recipe-row-copy>b{font-size:12px!important;color:#40394f;line-height:1.65}
#templatesPanel .recipe-row .template-actions{margin:0!important}
#templatesPanel .recipe-row .template-actions>button{font-size:11px!important;border-radius:5px;min-height:27px}
#templatesPanel .recipe-row .template-actions>button:first-child{background:#f3eff9;color:#695087;border-color:#e0d5ee}
#templatesPanel .recipe-thumbnail{height:76px!important;border-radius:5px;background:#fff}
.recipe-design-note{font-size:12px;line-height:1.8;color:#67768a;margin:0 0 14px}
#componentsPanel .catalog-purpose{display:none!important}
#componentsPanel .library-section[data-component-section]:not(.component-section-hidden){padding:4px!important;border:0!important}
.image-dock .vault-controls input:focus,.image-dock .vault-controls select:focus{border-color:#a5b2c4;outline:2px solid #dee5ef}
@media(max-width:600px){.structure-sequential .structure-row{grid-template-columns:18px minmax(0,1fr);gap:10px}.structure-row-controls{grid-column:2;flex-direction:row}.structure-sequential .structure-row-controls select{max-width:160px}.structure-sequential .workflow-media-strip img{width:136px}}
@media(prefers-reduced-motion:reduce){.library .tab,#templatesPanel .recipe-row{transition:none}}
.library #templatesPanel{padding:0!important;overflow:hidden!important;scrollbar-gutter:auto!important;min-height:0!important}
.library #templatesPanel:not(.hidden){display:flex!important;flex-direction:column!important}
#templateBrowseHeader{flex:none;min-width:0;padding:10px 14px;background:#f8fafd;border-bottom:1px solid #dce2eb}
#templateBrowseHeader .recipe-family-tabs{position:static;margin:0 0 8px!important;background:#eef0f6}
#templateBrowseHeader .recipe-family-tabs [aria-pressed=true]{border-color:#daccE8;color:#735789}
#templateBrowseHeader .template-recommend-button{display:block;width:100%;font-size:11px;margin:0}
#templateListViewport{flex:1;min-height:0;min-width:0;padding:10px 12px 14px 16px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#aeb9ca transparent}
.library.templates-view .tab.active{background:#f4effa!important;color:#785392!important;border-color:#d9c9e8!important}
.library.templates-view .library-title h2:after{background:#f0e9f7!important;color:#785392!important}
#templatesPanel .template-zero{padding:12px!important;margin-top:16px!important;border-top:1px solid #ded8e8!important;background:#f7f5fa!important}
#templatesPanel .template-zero p{display:none}

/* Full-width desk, quiet controls. Never scale or restyle article contents here. */
.library .library-head,.editor-side .panel-bar,.preview-side .panel-bar{min-height:54px!important;box-sizing:border-box}
.library .library-head{padding:10px 14px!important;background:#fff!important}
.library .tabs{padding:6px 10px!important;background:#fff!important;border-top:0!important}
.library .tab{min-height:36px!important}
.library .tab:not(.active){color:#758194!important}
#componentsPanel .component-subtabs button[data-component-section-tab]{font-weight:600!important}
#componentsPanel .component-subtabs button[data-component-section-tab]:not(.active){border-color:transparent!important;background:transparent!important;box-shadow:none!important}
#componentsPanel .component-subtabs button[data-component-section-tab]:hover{background:var(--category-soft)!important}
#componentsPanel .component-card-top b{font-size:12px!important;font-weight:600!important;color:#3c495b!important}
#componentsPanel .library-section[data-component-section] button.component-card:hover{border-color:var(--category)!important;background:var(--category-soft)!important;box-shadow:0 3px 8px #26344808!important}
#componentsPanel .library-section[data-component-section]:not(.component-section-hidden){padding:0!important}
.editor-side .panel-bar{background:#fffdf7!important}











.editor-side .editing-context{padding:8px 12px!important;background:#fffdf7!important}
.editor-side #editor{border-radius:8px!important}
.editor-side .editor-foot{background:#fafbfc!important}
.preview-side .panel-bar{background:#f8fafd!important}
.image-dock{background:#f3f5f8!important;box-shadow:0 2px 8px #26344804!important}
@media(min-width:1600px){.layout{gap:16px!important;padding:16px!important}.top{padding-left:24px!important;padding-right:24px!important}}
@media(prefers-reduced-motion:reduce){#componentsPanel .library-section[data-component-section] button.component-card{transition:none!important;transform:none!important}}

/* Peer panels share heading hierarchy. Article headings are not UI headings. */
.library .library-title h2,.editor-side .panel-bar>strong,.preview-side .panel-bar>strong{font:600 15px/1.5 var(--ui-font)!important;color:#344152!important;letter-spacing:0!important}
.editor-side .draft-name{font-size:12px;font-weight:500}
/* Template cards and review windows are owned by template-browsing.css. */
.component-curation-manage{padding:12px;margin-bottom:14px;border:1px solid #dce2eb;background:#f6f8fb;border-radius:8px;font:12px/1.8 var(--ui-font);color:#526278}
.component-curation-manage>nav{display:flex;gap:6px;flex-wrap:wrap}.component-curation-manage>p{margin:8px 0 0}
.curation-records{margin-top:12px;max-height:240px;overflow:auto;overscroll-behavior:contain;display:grid;gap:6px}.curation-records[hidden]{display:none}.curation-records>section{display:flex;gap:10px;align-items:center;border-top:1px solid #dfe5ed;padding-top:7px}.curation-records span{flex:1;min-width:0;overflow-wrap:anywhere}.curation-records small{display:block;color:#778395}.curation-records button{flex:none}



/* Four deliberate rows, with a distinct import/layout band and short group separators. */

.editor-side .organized-toolbar{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:5px!important;padding:9px 12px 0!important;background:#fff!important}





.editor-side .organized-toolbar select{border-color:#dbe2ec!important;background:#fff!important}





.editing-context button:disabled{opacity:.45;cursor:not-allowed}.editing-context .context-reason{display:block;flex-basis:100%;color:#856829;font:11px/1.6 var(--ui-font)}
#fullTemplatePreviewModal .modal-close{position:absolute!important;top:14px!important;right:16px!important;left:auto!important;z-index:2}
.full-template-preview-modal{position:relative!important}
.full-template-preview-head{position:relative;padding-right:48px!important}
.workflow-mapping{max-height:clamp(190px,30vh,280px)!important;overscroll-behavior:contain;scrollbar-gutter:stable}.workflow-media-row>small{line-height:1.7!important}
.workflow-media-row select[aria-label^="图片用途"]{width:min(100%,230px)}

/* editor-toolbar.css */
/* One layout owner: all tools stay in two visible, fully filled rows. */
.editor-side .toolbar{flex:none;display:flex;flex-direction:column;gap:7px;padding:10px;background:#fff;border-bottom:1px solid #dce2ea;position:relative;overflow:visible;box-sizing:border-box;white-space:normal;container-type:inline-size}
.toolbar .toolbar-row{display:flex;flex-wrap:nowrap;align-items:center;gap:5px;min-width:0;width:100%;margin:0}
.toolbar .toolbar-row-actions{padding-top:7px;border-top:1px solid #edf0f4}
.toolbar .tool-group{display:flex;align-items:center;flex:var(--tool-count) 0 auto;gap:2px;padding-right:5px;border-right:1px solid #e1e6ed;min-width:0}
.toolbar .tool-group:last-child{padding-right:0;border-right:0}
.toolbar-row>.tool-group>.tool,.toolbar-row>.tool-group>.style-select{flex:1 0 auto}
.tool{display:inline-flex;justify-content:center;align-items:center;gap:3px;box-sizing:border-box;position:relative;cursor:pointer;height:32px;min-width:26px;padding:0 3px;border:1px solid transparent;border-radius:5px;background:transparent;color:#4c5d74;font:500 12px/1 var(--ui-font);white-space:nowrap;transition:background-color .15s,border-color .15s}
.tool:hover{background:#f0f3f8;border-color:#d8e0eb}.tool[aria-pressed=true],.tool.active,.tool[aria-expanded=true]{color:#815c17;background:#fff4da;border-color:#e6cc96}.tool:disabled{opacity:.45;cursor:not-allowed}.tool:focus-visible,.toolbar select:focus-visible{outline:2px solid #ae8540;outline-offset:2px}
.tool svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}.tool i{font-style:normal}.tool .tool-arrow{font:10px/1 var(--ui-font);flex:none;margin:0;padding:0;position:static}
.tool[data-cmd=bold]{font-weight:700}.tool[data-cmd=italic]{font-style:italic}.tool[data-cmd=underline]{text-decoration:underline}.tool.strike-tool{text-decoration:line-through}
.toolbar-row .tool[data-cmd=bold],.toolbar-row .tool[data-cmd=italic],.toolbar-row .tool[data-cmd=underline],.toolbar-row .strike-tool{font-size:14px}
.toolbar .style-select{height:32px;width:62px;min-width:0;padding:0 3px;border:1px solid #dbe2ec;border-radius:5px;background:#fff;color:#4c5d74;font:12px var(--ui-font)}.toolbar #fontSelect{width:79px}.toolbar #fontSizeSelect{width:55px}
.toolbar .auto-layout-button{min-width:68px;padding:0 7px;background:#FFBA32;color:#352609;font-weight:600}.toolbar .auto-layout-button:hover{background:#ffca61}
.toolbar .icon-tool>.tool-label,.toolbar .labelled-tool>.tool-label,.toolbar .colour-tool>.tool-label{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.toolbar #structureBtn>.tool-label{position:static;clip-path:none;width:auto;height:auto;overflow:visible}.toolbar #structureBtn svg{display:none}
.toolbar .colour-tool{min-width:32px}.toolbar .colour-tool::before{display:block;flex:none;width:17px;height:18px;box-sizing:border-box;font-size:16px;line-height:16px;text-align:center;pointer-events:none}.toolbar .text-colour::before{content:'A';border-bottom:3px solid #4c5d74}.toolbar .background-colour::before{content:'A';background:#fff0b9;border-bottom:3px solid #FFBA32;border-radius:2px}
@container(min-width:650px){.toolbar #componentStyleBtn>.tool-label,.toolbar #pasteBtn>.tool-label,.toolbar #importBtn>.tool-label,.toolbar #insertBtn>.tool-label{position:static;clip-path:none;width:auto;height:auto;overflow:visible}.toolbar .tool{padding:0 4px}}
@container(min-width:780px){.toolbar .colour-tool>.tool-label,.toolbar #plainTextBtn>.tool-label,.toolbar #columnPresetBtn>.tool-label{position:static;clip-path:none;width:auto;height:auto;overflow:visible}.toolbar .toolbar-row{gap:6px}.toolbar .tool-group{padding-right:6px;gap:3px}}
.toolbar-tooltip{position:fixed;z-index:110;max-width:min(360px,90vw);padding:6px 9px;border-radius:5px;background:#263447;color:white;font:11px/1.5 var(--ui-font);pointer-events:none;box-shadow:0 3px 10px #27334724}.toolbar-tooltip[hidden]{display:none}
.layout-error{flex:none;display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 12px;background:#fff7ed;border-bottom:1px solid #ecd8b8;color:#815829;font:12px/1.6 var(--ui-font)}.layout-error>span{flex:1 1 240px}.layout-error button{font-size:11px}
@media(prefers-reduced-motion:reduce){.tool{transition:none}}

/* editor-resources.css */
/* Shared navigation hierarchy and resource rhythm. Never styles article contents. */
:root{--ui-primary-size:15px;--ui-secondary-size:13px;--resource-gap:10px;--resource-inset:12px;--dock-header-height:44px;--dock-collapsed-height:48px;--dock-control-size:28px;--dock-control-gap:6px;--dock-control-radius:7px}
@media(min-width:1280px){.layout{grid-template-columns:clamp(328px,24vw,380px) minmax(592px,1.65fr) minmax(280px,1fr)!important}}
@media(min-width:1100px) and (max-width:1279px){.layout{grid-template-columns:300px minmax(550px,1fr) minmax(0,1fr)!important}}
.library{--resource-tone:#eaf0fb;--resource-accent:#587aa9;--resource-hover:#f2f5fb}
.library.templates-view{--resource-tone:#f1eaf7;--resource-accent:#826097;--resource-hover:#f7f3fa}
.library .library-head{min-height:42px!important;padding:7px 12px 4px!important}
.library .library-title h2{font:600 var(--ui-primary-size)/1.5 var(--ui-font)!important;color:#344152!important;letter-spacing:0!important}
.library .library-title h2:after{display:none!important}
.library .tabs{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1fr;gap:0!important;padding:4px 8px 0!important;overflow:hidden;background:#fff!important;border-bottom:0!important}
.library .tabs>.tab{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;height:44px;min-height:44px!important;margin:0;padding:0 8px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#788494!important;font:600 var(--ui-secondary-size)/1.5 var(--ui-font)!important;transition:color 180ms;box-shadow:none!important;z-index:0}
.library .tabs>.tab.active{color:#344152!important;background:transparent!important;border:0!important;box-shadow:none!important;z-index:1}
.library .tabs>.tab:before{content:'';position:absolute;inset:0 -17px;z-index:-1;background:var(--resource-tone);opacity:0;transition:opacity 180ms;pointer-events:none;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 44' preserveAspectRatio='none'%3E%3Cpath d='M0 44C16 44 20 35 28 16Q35 0 53 0H147Q165 0 172 16C180 35 184 44 200 44Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.library .tabs>.tab.active:before{opacity:1}
.library .tabs>.tab:after{display:none!important}
.library .tabs>.tab:not(.active):hover{color:var(--resource-accent)!important}
.library .tabs>.tab:focus-visible{outline:2px solid var(--resource-accent);outline-offset:-5px;border-radius:14px!important}
.editor-side .panel-bar>strong,.preview-side .panel-bar>strong{font:600 var(--ui-primary-size)/1.5 var(--ui-font)!important}
.library #componentsPanel .component-subtabs,.library #templateBrowseHeader .recipe-family-tabs{display:grid!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);grid-template-columns:none!important;flex:none!important;position:relative!important;gap:0!important;min-height:48px;margin:0!important;padding:0 8px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;isolation:isolate}
.library #componentsPanel .component-subtabs{background:linear-gradient(180deg,var(--resource-tone),#f8fafd) #f8fafd!important;border-bottom:1px solid #e4e8ef!important}
.library #templateBrowseHeader{padding:0 0 8px!important;background:linear-gradient(180deg,var(--resource-tone),#f8fafd)!important;border-bottom:1px solid #e4e8ef}
.library #templateBrowseHeader .template-recommend-button{width:calc(100% - 24px);margin:0 12px!important;border-color:#e4dbed;background:#fffdfd;color:#826097;min-height:27px}
.library #componentsPanel .component-subtabs>button[data-component-section-tab],.library #templateBrowseHeader .recipe-family-tabs>button{position:relative;height:48px!important;min-width:0;padding:0 2px!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;font:500 var(--ui-secondary-size)/1.5 var(--ui-font)!important;letter-spacing:0!important;white-space:nowrap;color:#7b8797!important;transition:color 180ms;cursor:pointer}
.library #componentsPanel .component-subtabs>button[data-component-section-tab]:hover{color:var(--category)!important;background:transparent!important}
.library #componentsPanel .component-subtabs>button[data-component-section-tab]{color:var(--category)!important}
.library #componentsPanel .component-subtabs>button[data-component-section-tab].active{color:var(--category)!important;background:transparent!important}
.library #templateBrowseHeader .recipe-family-tabs>button:hover,.library #templateBrowseHeader .recipe-family-tabs>button[aria-pressed=true]{color:var(--resource-accent)!important;background:transparent!important}
.library #componentsPanel .component-subtabs>button:before{display:none!important}
.library #componentsPanel .component-subtabs:after,.library #templateBrowseHeader .recipe-family-tabs:after{content:'';position:absolute;bottom:5px;left:var(--indicator-x,26px);width:22px;height:3px;border-radius:3px;background:var(--indicator-color,#FFBA32);pointer-events:none;transition:left 200ms cubic-bezier(.22,.68,0,1),background-color 180ms}
.library #componentsPanel .component-subtabs>button:focus-visible,.library #templateBrowseHeader .recipe-family-tabs>button:focus-visible{outline:2px solid var(--resource-accent);outline-offset:-5px;border-radius:8px!important}
.library #componentsPanel .component-list-viewport,.library #templateListViewport{padding:var(--resource-inset)!important;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#b7c2d1 transparent}
.library #componentsPanel .catalog-grid,.library #officialTemplates,.library #savedTemplates{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:var(--resource-gap)!important;align-content:start;margin:0!important;padding:0!important}
.library #componentsPanel .library-section .component-card,.library #templatesPanel .recipe-row{margin:0!important;border-radius:9px!important}
.library #componentsPanel .library-section .component-card{height:48px!important;min-height:48px!important}
.library #componentsPanel .component-card-top b,.library #templatesPanel .recipe-row-copy>b{font-size:13px!important;font-weight:600!important;line-height:1.5!important}
@media(prefers-reduced-motion:reduce){.library .tabs>.tab,.library .tabs>.tab:before,.library #componentsPanel .component-subtabs>button,.library #templateBrowseHeader .recipe-family-tabs>button,.library #componentsPanel .component-subtabs:after,.library #templateBrowseHeader .recipe-family-tabs:after{transition:none!important}}
/* Two independent, resizable docks; navigation never scrolls behind the header. */
.layout>.library{display:grid!important;grid-template-rows:minmax(0,var(--template-fraction,54fr)) 12px minmax(296px,var(--resource-fraction,46fr))!important;gap:0!important;padding:0!important;min-height:0!important}
.layout>.library.templates-collapsed{grid-template-rows:var(--dock-collapsed-height) 12px minmax(0,1fr)!important}
.layout>.library.gallery-collapsed{grid-template-rows:minmax(0,1fr) 12px var(--dock-collapsed-height)!important}
.layout>.library.templates-collapsed.gallery-collapsed{grid-template-rows:var(--dock-collapsed-height) 12px var(--dock-collapsed-height)!important;align-content:start}
.template-dock{--dock-accent:var(--resource-accent);--dock-hover:var(--resource-tone);--dock-border:#d8e1ed;grid-row:1;min-height:0;overflow:hidden;display:grid;grid-template-rows:var(--dock-header-height) 48px minmax(0,1fr);border:1px solid #d8e1ed;border-top:3px solid #7896bc;border-radius:13px;background:#f8fafd;box-shadow:0 4px 14px #26375406}
.template-dock>.library-head{border:0!important;border-radius:0!important;margin:0!important;background:#f8fafd!important}
.template-dock>.library-head:after{display:none!important}.template-dock>.library-panel{grid-row:3!important;min-height:0!important;margin:0!important;border:0!important;border-radius:0!important}
.library.templates-view .template-dock>.library-head{background:#f8fafd!important;border:0!important}
.template-dock.is-collapsed{grid-template-rows:var(--dock-header-height)}
.layout>.library :is(#templateDock,#imagesPanel).is-collapsed>:not(.dock-head){display:none!important}
.library-splitter{grid-row:2;cursor:row-resize;position:relative;touch-action:none}
.library-splitter:after{content:'';position:absolute;width:32px;height:3px;border-radius:4px;background:#bdc8d8;left:calc(50% - 16px);top:5px;transition:width .16s,background .16s}
.library-splitter:hover:after,.library-splitter:focus-visible:after{width:50px;left:calc(50% - 25px);background:#7792b8}
.layout>.library>#imagesPanel{--dock-accent:#826097;--dock-hover:#f0edf5;--dock-border:#ded8e9;grid-row:3!important;margin:0!important;border:1px solid #ded8e9!important;border-top:3px solid #a194b8!important;border-radius:13px!important;background:#faf9fc!important;min-height:0!important;padding:0 12px 10px!important;display:flex!important;flex-direction:column!important;gap:8px!important;overflow:hidden!important}
.layout>.library>#imagesPanel.is-collapsed{padding-bottom:0!important}
.layout>.library :is(#templateDock,#imagesPanel)>.dock-head{box-sizing:border-box!important;display:flex!important;align-items:center!important;flex:none!important;height:var(--dock-header-height)!important;min-height:var(--dock-header-height)!important;padding:0 var(--resource-inset)!important;border:0!important;gap:0!important}
.layout>.library>#imagesPanel>.dock-head{margin:0 calc(-1 * var(--resource-inset))!important}
.library .dock-head .dock-header-row{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;min-width:0;gap:12px!important}
.library .dock-head .dock-heading{margin:0!important;padding:0!important;min-width:0;font:600 var(--ui-primary-size)/1.5 var(--ui-font)!important;letter-spacing:0!important;color:#344152!important;white-space:nowrap}
.library .dock-head .dock-actions{display:flex!important;align-items:center!important;flex:none;margin:0 0 0 auto!important;gap:var(--dock-control-gap)!important}
.library .dock-head :is(.dock-action,.dock-collapse){box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:none!important;height:var(--dock-control-size)!important;min-height:var(--dock-control-size)!important;margin:0!important;padding:0 8px!important;border:1px solid var(--dock-border)!important;border-radius:var(--dock-control-radius)!important;background:#fff!important;color:var(--dock-accent)!important;font:500 12px/1 var(--ui-font)!important;cursor:pointer;box-shadow:none!important;transition:background-color .16s,border-color .16s,color .16s}
.library .dock-head .dock-action{min-width:44px!important}
.library .dock-head .dock-collapse{width:var(--dock-control-size)!important;min-width:var(--dock-control-size)!important;padding:0!important}
.library .dock-head :is(.dock-action,.dock-collapse):hover{background:var(--dock-hover)!important;border-color:var(--dock-accent)!important}
.library .dock-head :is(.dock-action,.dock-collapse):active{background:var(--dock-hover)!important}
.library .dock-head :is(.dock-action,.dock-collapse):focus-visible{outline:2px solid var(--dock-accent);outline-offset:2px}
.library .dock-head .dock-collapse svg{display:block;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;transition:transform .18s ease}
.library .dock-head .dock-collapse[aria-expanded=false] svg{transform:rotate(-90deg)}
@media(prefers-reduced-motion:reduce){.library .dock-head :is(.dock-action,.dock-collapse),.library .dock-head .dock-collapse svg{transition:none!important}}
.library #imagesPanel .image-collection{flex:1!important;min-height:0!important;height:auto!important;overflow-y:auto!important;overscroll-behavior:contain;padding:0 3px 8px 0!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-content:start!important;gap:10px!important;border:0!important;scrollbar-width:thin;scrollbar-color:#c3bad2 transparent}
.library #imagesPanel .vault-controls{flex:none;display:flex!important;gap:6px!important;flex-wrap:wrap;padding:0!important;margin:0!important;background:none!important;border:0!important}
.vault-controls .vault-search{flex:1 1 94px;min-width:70px}.vault-controls .vault-search input{width:100%;height:30px!important;font-size:11px!important;padding:5px 7px!important}.vault-controls button{height:30px!important;font-size:11px!important;padding:0 7px!important;color:#6f608b!important;border-color:#dcd6e6!important}
.vault-category-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;flex:none;padding:4px;background:#f0edf5;border-radius:9px}
.vault-category-tabs button{min-width:0;border:1px solid transparent;border-radius:6px;background:transparent;color:#7e748c;font:500 11px/1.6 var(--ui-font);padding:5px 2px;cursor:pointer;transition:background .15s,color .15s,box-shadow .15s;white-space:nowrap}
.vault-category-tabs button[aria-pressed=true]{background:#fff;border-color:#e5deec;color:var(--category-color,#796293);box-shadow:0 2px 5px #4936570c}
.vault-category-tabs button:hover{color:var(--category-color,#796293)}
.library #imagesPanel .image-item{position:relative;display:flex!important;flex-direction:column!important;gap:6px!important;margin:0!important;padding:7px!important;height:auto!important;min-height:0!important;border:1px solid #e0dbe8!important;border-radius:10px!important;background:#fff!important;overflow:visible!important}
.library #imagesPanel .image-item>img{width:100%!important;height:94px!important;object-fit:contain!important;border-radius:6px!important;background:#f6f5f8!important}
.image-meta{display:flex;align-items:center;gap:4px;min-width:0}.image-meta .image-name{flex:1;min-width:0;margin:0!important;padding:0!important;font-size:11px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.library #imagesPanel .image-item .image-category{position:static!important;width:auto!important;max-width:66px;flex:none;margin:0!important;border:0!important;border-radius:4px;background:#f0edf5!important;color:#786589!important;font:10px/1.6 var(--ui-font);padding:2px 4px!important;height:auto!important;cursor:pointer}
.library #imagesPanel .image-item button.rename-image{right:32px!important}.library #imagesPanel .image-item>button{width:23px!important;height:23px!important;top:9px!important}
.library #imagesPanel .vault-batch{flex:none;padding:6px!important;gap:5px!important;background:#f0edf5!important;border:1px solid #e0d9e9!important;border-radius:8px}
.library #imagesPanel .vault-batch[hidden]{display:none!important}
.layout>.library:not(.gallery-collapsed):not(.templates-collapsed):has(.vault-batch:not([hidden])){grid-template-rows:minmax(130px,var(--template-fraction)) 12px minmax(350px,var(--resource-fraction))!important}
.layout>.library:not(.gallery-collapsed):not(.templates-collapsed):has(.image-vault-status:not([hidden])){grid-template-rows:minmax(130px,var(--template-fraction)) 12px minmax(350px,var(--resource-fraction))!important}
.layout>.library:not(.gallery-collapsed):not(.templates-collapsed):has(.vault-batch:not([hidden])):has(.image-vault-status:not([hidden])){grid-template-rows:minmax(130px,var(--template-fraction)) 12px minmax(410px,var(--resource-fraction))!important}
.library #imagesPanel .image-vault-status{flex:none;margin:0!important;padding:4px 7px!important;font-size:11px;line-height:1.5}
.library #imagesPanel .vault-batch{display:flex!important;flex-wrap:wrap!important;align-items:center!important}.library #imagesPanel .vault-batch>*{height:26px!important;font-size:10px!important;min-height:0!important;padding:3px 5px!important}.library #imagesPanel .vault-batch select{width:100px!important;flex:1;min-width:90px}
.resource-manager-list{display:grid;gap:8px}.resource-manager-row{display:flex;gap:12px;align-items:center;border:1px solid #e3deeb;border-radius:10px;padding:9px}.resource-manager-row img{width:48px;height:48px;object-fit:contain}.resource-manager-row span{flex:1;min-width:0;overflow-wrap:anywhere;font-size:13px}.resource-manager-row small{display:block;color:#8a7d95}.manager-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}.manager-tabs button[aria-pressed=true]{background:#eee8f6;color:#725a91;border-color:#cbbddc}
.library #componentsPanel .component-subtabs>button[data-component-section-tab].active,.library #templateBrowseHeader .recipe-family-tabs>button[aria-pressed=true]{font-weight:750!important}

.image-item .official-label{position:absolute;right:9px;top:9px;padding:3px 8px;border-radius:7px;background:#f2edf9;color:#796293;font-size:11px;font-weight:600;pointer-events:none}.image-item.gif:before{display:none}.image-item .media-format{position:absolute;left:10px;top:142px;color:#67748c;font-size:11px;background:#fff;padding:2px 6px;border-radius:5px}.image-item{position:relative}.image-meta{min-width:0}.image-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


.image-item .media-format{top:auto;bottom:55px}.image-item.gif::after{display:none}

/* template-browsing.css */
/* Browsing chrome only. Article HTML, text styles and publication sizing stay intact. */
#templatesPanel .recipe-row[hidden]{display:none!important}
#templatesPanel .recipe-row{display:grid!important;grid-template-columns:54px minmax(0,1fr)!important;gap:12px!important;padding:12px!important;margin:0!important;min-height:104px!important;align-items:stretch!important;box-sizing:border-box;border:1.5px solid #e0daeb!important;box-shadow:0 2px 6px #35465e04;transition:border-color 160ms,box-shadow 160ms}
#templatesPanel .recipe-row:hover,#templatesPanel .recipe-row:focus-within{border-color:#aa96c1!important;box-shadow:0 4px 12px #5740670d}
#templatesPanel .recipe-row-copy{display:grid!important;grid-template-rows:36px 18px 28px!important;gap:6px!important;min-width:0;align-content:stretch}
#templatesPanel .recipe-row .recipe-purpose{font:11px/18px var(--ui-font);color:#7c7188;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:400}
#templatesPanel .recipe-row-copy>b{margin:0!important;align-self:center;font-size:13px!important;line-height:1.5!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;color:#40394f}
#templatesPanel .recipe-row .template-actions{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 26px!important;gap:6px!important;margin:0!important;align-items:center;min-width:0}
#templatesPanel .recipe-row .template-actions>button{width:100%;height:28px!important;min-height:28px!important;padding:0 2px!important;font-size:11px!important;white-space:nowrap;border-radius:6px}
#templatesPanel .recipe-row .template-actions>button:first-child{background:#f3eff9;color:#695087;border-color:#e0d5ee}
#templatesPanel .recipe-thumbnail{width:54px!important;height:78px!important;margin:0!important;align-self:center;border-radius:5px}
#templatesPanel .recipe-more,#templatesPanel .recipe-more[open]{display:block!important;flex-basis:auto!important;width:26px;align-self:center;position:relative;font-size:11px}
#templatesPanel .recipe-more summary{display:grid!important;place-items:center;width:26px!important;height:28px;padding:0!important;border:1px solid #e0d9e8;border-radius:6px;background:#fff;box-sizing:border-box}
#templatesPanel .recipe-more summary:hover,#templatesPanel .recipe-more[open] summary{background:#f3eff9;color:#695087}
#templatesPanel .recipe-more-menu{position:fixed;right:auto;z-index:100;width:152px;max-width:calc(100vw - 16px);overflow-y:auto;overscroll-behavior:contain;padding:6px;background:#fff;border:1px solid #ded8e8;border-radius:9px;box-shadow:0 8px 24px #30304524;display:grid;gap:4px}
#templatesPanel .recipe-more-menu button{display:block;width:100%;min-height:32px;margin:0!important;font:12px var(--ui-font);text-align:left;padding:6px 9px!important;border:0!important;background:#fff;border-radius:5px;color:#5a496b;cursor:pointer}
#templatesPanel .recipe-more-menu button:hover{background:#f3eff9}
#templatesPanel .recipe-row:has(.recipe-more[open]){position:relative;z-index:3}
#templatesPanel :is(.template-actions button,.recipe-more summary):focus-visible{outline:2px solid #826097;outline-offset:2px}

/* Review: settings and article scroll independently, while confirmation stays visible. */
.recipe-selection-tip{font:12px/1.8 var(--ui-font);color:#705988;padding:12px;background:#f5f1f9;border-radius:8px}
#fullTemplatePreviewModal .full-template-preview-modal{display:flex;flex-direction:column;position:relative!important;width:min(1000px,calc(100vw - 32px))!important;height:min(860px,92vh);max-height:92vh!important;padding:0!important;border-radius:16px!important;background:#fff;overflow:hidden!important}
#fullTemplatePreviewModal .full-template-preview-head{flex:none;padding:20px 60px 16px 24px!important;border-bottom:1px solid #e1e6ee;background:#fff}
#fullTemplatePreviewTitle{font:600 20px/1.5 var(--ui-font);margin:0 0 6px;overflow-wrap:anywhere;max-height:90px;overflow-y:auto}
#fullTemplatePreviewCopy{font:12px/1.7 var(--ui-font);color:#738092;margin:0}
#fullTemplatePreviewModal .modal-close{position:absolute!important;right:16px!important;top:16px!important;left:auto!important;z-index:2}
.template-review-body{display:grid;grid-template-columns:minmax(280px,1fr) minmax(430px,1.35fr);flex:1;min-height:0;overflow:hidden}
#fullTemplatePreviewModal #workflowMapping{margin:0;padding:20px;border:0;border-right:1px solid #e1e6ee;border-radius:0;background:#f8f9fc;max-height:none!important;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#c6ceda transparent}
#workflowMapping .template-control-title{margin:0;font:600 13px/1.6 var(--ui-font);color:#344152}
#workflowMapping .template-view-options{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:12px 0;padding:0}
#workflowMapping .template-option{display:flex;flex-direction:column;gap:6px;min-width:0;font:11px/1.5 var(--ui-font);color:#758194}
#workflowMapping .template-option-wide{grid-column:1/-1}
#workflowMapping .template-option select{width:100%;max-width:100%;height:34px;box-sizing:border-box;font:12px var(--ui-font);color:#435269;padding:0 8px;border:1px solid #dce2eb;border-radius:7px;background:#fff}
#workflowMapping .template-option input[type=color]{width:100%;height:34px;box-sizing:border-box;padding:4px;border:1px solid #dce2eb;border-radius:7px;background:#fff}
#workflowMapping .studio-hint{margin:12px 0 20px;font:11px/1.8 var(--ui-font);color:#7c8797}
.template-mapping-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #e1e6ee;padding-top:16px;margin:0 0 10px}
.template-mapping-heading .small-button{font-size:11px;height:28px}
.template-mapping-toggle{width:100%;min-height:30px;font-size:11px!important;margin:0 0 10px;border-style:dashed!important;background:#fff!important}
#workflowMapping .workflow-map-row{grid-template-columns:minmax(0,1fr);gap:8px;margin:0 0 10px;padding:12px;border:1px solid #e1e6ee;border-radius:9px;background:#fff}
#workflowMapping .workflow-map-row b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font:500 12px/1.75 var(--ui-font);color:#46556b}
#workflowMapping .workflow-map-row select{width:100%;max-width:100%;height:32px;font-size:12px;box-sizing:border-box}
#workflowMapping .workflow-media-strip img{width:54px;height:44px;object-fit:contain}
#workflowMapping :is(select,input,button):focus-visible{outline:2px solid #826097;outline-offset:2px}
#fullTemplatePreviewModal .full-template-preview-stage{min-width:0;min-height:0;max-height:none;padding:24px 16px;background:#edf1f6;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c2ccd9 transparent}
#fullTemplatePreviewCanvas.studio-preview-paper{width:390px!important;min-width:390px!important;max-width:none!important;margin:0 auto;padding:25px 20px 34px!important;border:0;border-radius:0;box-shadow:0 4px 18px #1d30460c}
#fullTemplatePreviewModal .full-template-preview-actions{flex:none;display:flex;gap:10px;align-items:center;padding:14px 24px;border-top:1px solid #e1e6ee;background:#fff}
.full-template-preview-actions>span{margin-right:auto;font:11px/1.6 var(--ui-font);color:#8b95a3}
#fullTemplatePreviewModal .full-template-preview-actions button{width:auto;min-width:110px;height:36px;padding:0 16px}

/* Full-size sample uses the same 390px paper / 350px text area as the draft preview. */
.recipe-sample-modal .studio-modal{width:min(920px,calc(100vw - 32px));max-width:920px;height:min(860px,92vh);max-height:92vh;padding:0!important;overflow:hidden;border-radius:16px!important}
.recipe-sample-modal .studio-modal>h2{flex:none;margin:0;padding:20px 60px 18px 24px;border-bottom:1px solid #e1e6ee;font:600 20px/1.5 var(--ui-font);overflow-wrap:anywhere;max-height:130px;overflow:auto}
.recipe-sample-modal .studio-modal>.studio-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(220px,1fr) minmax(430px,1.6fr);padding:0;overflow:hidden}
.recipe-sample-sidebar{min-width:0;overflow:auto;padding:20px;background:#f8f9fc;border-right:1px solid #e1e6ee}
.recipe-sample-sidebar .recipe-preview-switch{display:grid;grid-template-columns:1fr 1fr;padding:4px;gap:4px;background:#eae7f1;border:0;border-radius:9px;margin:0 0 18px}
.recipe-sample-sidebar .recipe-preview-switch button{padding:8px 4px;margin:0;min-width:0;border:1px solid transparent;border-radius:6px;background:transparent;font:500 12px/1.5 var(--ui-font);color:#85788f;cursor:pointer;transition:background 160ms,color 160ms,box-shadow 160ms}
.recipe-sample-sidebar .recipe-preview-switch button[aria-pressed=true]{background:#fff;color:#75578c;border-color:#e0d9e8;box-shadow:0 2px 6px #49365709}
.recipe-sample-sidebar .recipe-preview-switch button:focus-visible{outline:2px solid #826097;outline-offset:2px}
.recipe-sample-sidebar .recipe-design-note{font:13px/1.9 var(--ui-font);color:#526278;margin:0 0 18px}
.recipe-preview-status{padding:12px;border:1px solid #e2dbe9;border-radius:8px;background:#fff;font:12px/1.8 var(--ui-font);color:#6b5b7a;margin:0 0 12px}
.recipe-sample-sidebar .studio-hint{font:11px/1.8 var(--ui-font);color:#8993a3;margin:0}
.recipe-sample-modal .recipe-sample-stage{min-width:0;min-height:0;margin:0;border:0;border-radius:0;padding:24px 16px;background:#edf1f6;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c2ccd9 transparent}
.recipe-sample-modal .recipe-sample-stage .studio-sample-paper{width:390px;min-width:390px;max-width:none;margin:0 auto;padding:25px 20px 34px;border:0;border-radius:0;box-shadow:0 4px 18px #1d30460c}
.recipe-sample-modal .studio-footer{flex:none;padding:14px 24px;border-top:1px solid #e1e6ee;background:#fff}
@media(max-width:820px){
  .template-review-body,.recipe-sample-modal .studio-modal>.studio-body{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(110px,.65fr) minmax(180px,1fr)}
  #fullTemplatePreviewModal #workflowMapping,.recipe-sample-sidebar{border-right:0;border-bottom:1px solid #e1e6ee;padding:14px 18px}
  #workflowMapping .template-view-options{grid-template-columns:repeat(3,minmax(0,1fr))}
  #workflowMapping .template-option-wide{grid-column:auto}
  #fullTemplatePreviewModal .full-template-preview-stage,.recipe-sample-modal .recipe-sample-stage{padding:18px 8px}
  .recipe-sample-sidebar .recipe-preview-switch{max-width:320px;margin-bottom:12px}
  .full-template-preview-actions>span{display:none}
}
@media(prefers-reduced-motion:reduce){#templatesPanel .recipe-row,.recipe-sample-sidebar .recipe-preview-switch button{transition:none!important}}

/* Full-template cards: spacious sample column and an aligned three-action row. */
#templatesPanel .recipe-row{grid-template-columns:minmax(72px,35%) minmax(0,1fr)!important;gap:14px!important;padding:14px!important;min-height:154px!important;border-radius:12px!important;background:#fff}
#templatesPanel .recipe-row-copy{grid-template-rows:minmax(42px,1fr) auto 32px!important;gap:9px!important;align-content:stretch}
#templatesPanel .recipe-row-copy>b{font-size:14px!important;line-height:1.5!important;align-self:start!important;padding-top:3px}
#templatesPanel .recipe-row .recipe-purpose{font-size:11px;line-height:1.5;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
#templatesPanel .recipe-thumbnail{width:100%!important;height:124px!important;align-self:stretch!important;border-radius:7px;background:#fffdf9;box-shadow:0 2px 5px #473e2910}
#templatesPanel .recipe-thumbnail>section{transform:scale(.26);transform-origin:top left}
#templatesPanel .recipe-thumbnail>small{font-size:10px;padding:5px 0}
#templatesPanel .recipe-row .template-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;align-self:end}
#templatesPanel .recipe-row .template-actions>button,#templatesPanel .recipe-more summary{height:32px!important;min-height:32px!important;font-size:11px!important;padding:0 2px!important;width:100%!important}
#templatesPanel .recipe-more,#templatesPanel .recipe-more[open]{width:100%!important;min-width:0;font-size:11px}
#templatesPanel .recipe-more summary{font-weight:500}
#templatesPanel{container-type:inline-size}
@container(max-width:280px){#templatesPanel .recipe-row{grid-template-columns:72px minmax(0,1fr)!important;gap:10px!important;padding:10px!important}#templatesPanel .recipe-thumbnail>section{transform:scale(.205)}#templatesPanel .recipe-row-copy>b{font-size:13px!important}#templatesPanel .recipe-row .template-actions>button,#templatesPanel .recipe-more summary{font-size:10px!important}}
#templatesPanel .recipe-thumbnail>section{transform:scale(var(--sample-scale,.205))!important;width:350px!important;min-width:350px!important;max-width:none!important;padding:14px 18px!important}#templatesPanel .recipe-thumbnail>section>section{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box}
#componentsPanel .component-subtabs button[aria-selected=true],#componentsPanel .component-subtabs button.active,#templatesPanel button[aria-pressed=true]{font-weight:750!important}

.recipe-row,.component-card{position:relative}.recipe-row .official-label,.component-card .official-label{position:absolute;right:10px;top:8px;border-radius:6px;padding:2px 7px;background:#f2edf9;color:#796293;font-size:10px;font-weight:600;pointer-events:none}.recipe-row-copy{padding-top:12px}

/* editor-guide.css */
/* Task-first tutorial; independent of document and editor styles. */
.guide-product-map .guide-product-label{display:inline-block;padding:5px 9px;background:#fff4da;color:#77521b;font-size:11px;border-radius:4px}
#guideModal .guide-product-map h3{font:600 24px/1.55 var(--ui-font);letter-spacing:-.4px;color:#24282f;margin:18px 0 12px}
.guide-capabilities{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}
.guide-capabilities b{display:block;padding:12px 0;border-top:1px solid #e4e6eb;font-size:13px;color:#344152}
.guide-capabilities small{display:block;font-size:11px;line-height:1.7;color:#6e7887;font-weight:400;margin-top:5px}
#guideModal .guide-product-boundary{font-size:11px!important;color:#6e7887;padding-top:14px;border-top:1px solid #e4e6eb}
#guideModal .guide-modal{position:relative;width:min(1040px,calc(100vw - 32px))!important;height:min(880px,92vh);max-height:92vh!important;padding:0!important;display:flex;flex-direction:column;background:#f8f9fc!important;border:1px solid #dce2ec!important;border-radius:16px!important;overflow:hidden}
#guideModal .guide-modal>.modal-close{position:absolute;top:18px;right:18px;left:auto;z-index:2}
#guideModal .guide-head{flex:none;padding:24px 64px 16px 28px;background:linear-gradient(108deg,#f1f2ff,#f7f5ff 55%,#fff8ed)}
#guideModal .guide-kicker{font:500 11px/1.5 var(--ui-font);letter-spacing:1px;color:#8a7798}
#guideModal .guide-head h2{font:600 23px/1.5 var(--ui-font)!important;letter-spacing:0;margin:7px 0;color:#344152}
#guideModal .guide-head p{font:13px/1.7 var(--ui-font)!important;margin:0;color:#748195}
#guideModal .guide-jumps{flex:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;padding:12px 24px;border-bottom:1px solid #e0e5ee;background:#fff}
#guideModal .guide-jumps button{min-height:36px;background:transparent;border:1px solid transparent;border-radius:8px;font:500 13px/1.5 var(--ui-font);color:#7a8495;cursor:pointer;transition:background 160ms,color 160ms,border-color 160ms}
#guideModal .guide-jumps button[aria-current=step]{background:#fff5df;border-color:#ecd39c;color:#806126}
#guideModal .guide-jumps button:hover{background:#f4f5fa}
#guideModal .guide-jumps button:focus-visible,#guideModal .guide-details summary:focus-visible,#guideModal .guide-practice button:focus-visible{outline:2px solid #9b80b2;outline-offset:2px}
#guideModal .guide-progress{display:none!important}
#guideModal .guide-pages{flex:1;min-height:0!important;overflow:auto;padding:24px 28px!important;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c2ccda transparent}
#guideModal .guide-page{font:13px/1.85 var(--ui-font);color:#536172}
#guideModal .guide-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:28px;align-items:start}
#guideModal .guide-page p{font:13px/1.85 var(--ui-font)!important;color:inherit;margin:6px 0 0}
#guideModal .guide-before{margin:0 0 20px!important;color:#7a8697!important;font-size:12px!important}
#guideModal .guide-task-steps{list-style:none;padding:0;margin:0;counter-reset:guide-step}
#guideModal .guide-task-steps>li{position:relative;counter-increment:guide-step;padding:0 0 20px 38px;margin:0}
#guideModal .guide-task-steps>li:before{content:counter(guide-step,decimal-leading-zero);position:absolute;left:0;top:0;display:grid;place-items:center;width:25px;height:25px;border:1px solid #dce3ed;border-radius:8px;background:white;color:#7c8b9f;font:600 11px/1 var(--ui-font)}
#guideModal .guide-task-steps strong{font-weight:600;color:#344152;font-size:14px}
#guideModal .guide-outcome,#guideModal .guide-recovery{padding:14px 16px;border:1px solid #e0e6ef;border-radius:10px;background:#fff;margin:0 0 12px}
#guideModal .guide-outcome{background:#fffaf0;border-color:#eadcb8}
#guideModal .guide-page :is(.guide-outcome,.guide-recovery) h3{font:600 12px/1.7 var(--ui-font)!important;margin:0;color:#75623b}
#guideModal .guide-recovery h3{color:#67768b!important}
#guideModal .guide-page :is(.guide-outcome,.guide-recovery) p{font-size:12px!important;margin-top:4px}
#guideModal .guide-details{border-top:1px solid #e0e5ee;margin-top:18px;padding-top:14px}
#guideModal .guide-details summary{cursor:pointer;color:#8a7498;font:500 12px/1.8 var(--ui-font);padding:4px 0}
#guideModal .guide-details h3{font:600 14px/1.7 var(--ui-font)!important;margin:16px 0 8px}
#guideModal .guide-details ol{padding-left:20px}#guideModal .guide-details li{margin-bottom:10px}
#guideModal .guide-details aside{padding:12px 14px!important;background:#f0f3f8!important;border:1px solid #dfe5ee;border-left:3px solid #9aaac2!important;border-radius:8px;font:12px/1.85 var(--ui-font);color:#67768b}
#guideModal .guide-practice{padding:18px;border:1px solid #dfe5ee;border-radius:12px;background:#fff;min-width:0;box-shadow:0 5px 18px #23334b05}
#guideModal .guide-practice>small{display:block;font:500 11px/1.6 var(--ui-font);color:#8993a3;margin-bottom:16px}
#guideModal .guide-practice button{padding:8px 9px;min-height:32px;border:1px solid #dce2eb;border-radius:7px;background:#f8f9fc;font:12px var(--ui-font);color:#536177;cursor:pointer;margin:0 4px 9px 0}
#guideModal .guide-practice button[aria-pressed=true]{background:#fff2d4;border-color:#e3ca95;color:#7c6130}
#guideModal .guide-practice [contenteditable]{min-height:140px;outline:0;border:1px solid #dfe5ee;border-radius:8px;padding:14px;font:14px/1.9 var(--ui-font);color:#333;overflow-wrap:anywhere}
#guideModal .guide-practice [contenteditable]:focus{border-color:#c8a258;box-shadow:0 0 0 2px #fff2d4}
#guideModal .guide-feedback{display:block;min-height:36px;font:11px/1.7 var(--ui-font);color:#8a7854;margin-top:12px}
#guideModal .guide-practice .demo-card{padding:14px;border:2px solid #ffba32;border-radius:10px;background:#fff9ee}
#guideModal .guide-practice .demo-card p{margin:0}
#guideModal .guide-zones{display:grid;gap:10px}
#guideModal .guide-zones b{display:block;border:1px solid #dce3ee;border-left:3px solid #7394c2;border-radius:8px;padding:15px 12px;background:#f5f8fd;font-size:12px;font-weight:500}
#guideModal .guide-zones b:nth-child(2){border-left-color:#e6b34e;background:#fffbf3}
#guideModal .guide-zones b:nth-child(3){border-left-color:#91a0b4;background:#f3f5f8}
#guideModal .demo-images{max-height:350px;overflow:auto;overscroll-behavior:contain}
#guideModal .guide-phone{box-sizing:border-box;width:230px;max-width:100%;height:350px;border:7px solid #252b34;border-radius:28px;overflow:hidden;background:#fff;padding:0;box-shadow:0 8px 20px #23334b18;margin:7px auto}
#guideModal .guide-phone article{box-sizing:border-box;height:100%;overflow:auto;padding:20px 14px;overscroll-behavior:contain;font:12px/1.9 var(--ui-font);color:#333;scrollbar-width:thin;scrollbar-color:#aeb5bf transparent}
#guideModal .guide-phone h4{font-size:16px;margin:0 0 12px;line-height:1.6}
#guideModal .guide-phone figure{margin:14px 0}#guideModal .guide-phone img{width:100%;height:auto;display:block}
#guideModal .guide-phone.dark{background:#191919}#guideModal .guide-phone.dark article{color:#d1d1d1;scrollbar-color:#646972 transparent}#guideModal .guide-phone.dark h4{color:#eee}
#guideModal .guide-footer{flex:none;display:flex;align-items:center;gap:10px;margin:0;padding:14px 24px;border-top:1px solid #e0e5ee;background:#fff}
#guideModal .guide-footer #guideCount{margin:auto;font:12px var(--ui-font);color:#8590a0}
#guideModal .guide-footer button{height:36px;width:auto;min-width:92px;padding:0 14px}
@media(max-width:820px){#guideModal .guide-layout{grid-template-columns:minmax(0,1fr)}#guideModal .guide-practice{max-width:100%}#guideModal .guide-jumps{grid-template-columns:repeat(3,minmax(0,1fr));padding:8px 16px}#guideModal .guide-pages{padding:18px!important}#guideModal .guide-head{padding:18px 54px 12px 20px}#guideModal .guide-head h2{font-size:19px!important}}
@media(prefers-reduced-motion:reduce){#guideModal .guide-page{animation:none!important}#guideModal .guide-jumps button{transition:none!important}}

/* editor-motion.css */
/* Shared motion system. Article, device positioning and exports stay untouched. */
:root{--motion-fast:160ms;--motion-panel:280ms;--motion-ease:cubic-bezier(.22,1,.36,1)}
.library .library-panel:not(.hidden),#guideModal .guide-page{animation:none!important}
@keyframes workbench-dialog{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes workbench-overlay{from{background-color:rgba(28,38,55,0)}to{background-color:rgba(28,38,55,.32)}}
.modal.open{animation:workbench-overlay 220ms ease-out!important}
.modal.open>.modal-box{animation:workbench-dialog var(--motion-panel) var(--motion-ease)!important;translate:0 0!important}
.top button,.toolbar button,.toolbar select,.small-button,.preview-controls button,.modal-close,.modal-action,.modal .button,.guide-jumps button,.recipe-preview-switch button,.vault-category-tabs button,.dock-action,.dock-collapse{transition:background-color var(--motion-fast) ease-out,border-color var(--motion-fast) ease-out,color var(--motion-fast) ease-out,box-shadow var(--motion-fast) ease-out!important}
.library :is(.recipe-row,.component-card,.image-item){transition:box-shadow 200ms ease-out,border-color 200ms ease-out,background-color 200ms ease-out,transform 200ms var(--motion-ease)!important}
.library .tabs>.tab{transition:color 200ms ease-out!important}
.library .tabs>.tab:before{transition:opacity var(--motion-panel) var(--motion-ease),background-color var(--motion-panel) ease-out!important}
.library :is(.component-subtabs,.recipe-family-tabs):after{transition:left var(--motion-panel) var(--motion-ease),background-color 200ms ease-out!important}
.dock-collapse svg{transition:transform var(--motion-panel) var(--motion-ease)!important}
.image-dock .image-item button{transition:opacity 200ms ease-out,background-color var(--motion-fast) ease-out!important}
@keyframes workbench-menu{from{opacity:0;translate:0 -4px}to{opacity:1;translate:0 0}}
.recipe-more[open]>.recipe-more-menu,.tool-popover.open{animation:workbench-menu 180ms var(--motion-ease)}
.dock-action:active,.dock-collapse:active,.recipe-preview-switch button:active{box-shadow:inset 0 1px 3px #27344316!important}
.top .button:active,.toolbar .button:active,.modal .button:active,.small-button:active{transform:none!important;box-shadow:inset 0 1px 3px #27344316}
@media(prefers-reduced-motion:reduce){
  .modal.open,.modal.open>.modal-box,.library .library-panel:not(.hidden),.recipe-more[open]>.recipe-more-menu,.tool-popover.open{animation:none!important}
  .top button,.toolbar button,.toolbar select,.small-button,.preview-controls button,.modal-close,.modal-action,.modal .button,.guide-jumps button,.recipe-preview-switch button,.vault-category-tabs button,.dock-action,.dock-collapse,.dock-collapse svg,.image-dock .image-item button,.library :is(.recipe-row,.component-card,.image-item),.library .tabs>.tab,.library .tabs>.tab:before,.library :is(.component-subtabs,.recipe-family-tabs):after{transition:none!important}
}

