/* 介绍页的迷你编辑器（demo.js）。只用介绍页已有的 token（--c-* / --r / --s* / --f-*），样子照着真编辑器缩小 */
.mini{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:var(--s5);align-items:start;--mv:cubic-bezier(.645,.045,.355,1)}
.mn-win{position:relative;display:flex;flex-direction:column;height:700px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r);box-shadow:0 24px 60px rgba(30,33,36,.12);overflow:hidden;font-size:var(--f-md);line-height:1.5;-webkit-tap-highlight-color:transparent}
.mn-win button{font:inherit;color:inherit;cursor:pointer}
.mn-sp{flex:1}
.mn-chrome{display:flex;align-items:center;gap:var(--s2);height:40px;padding:0 var(--s2);border-bottom:1px solid var(--c-line);font-size:var(--f-sm);color:var(--c-text-lite)}
.mn-lights{display:flex;gap:6px}
.mn-lights i{width:10px;height:10px;border-radius:var(--r-pill);background:var(--c-line)}
.mn-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:0 14px;border:1px solid var(--c-line);border-radius:var(--r-pill);background:#fff;white-space:nowrap;text-decoration:none;color:var(--c-text);transition:border-color var(--t-fast) var(--ease-out),background var(--t-fast) var(--ease-out)}
.mn-btn:hover{border-color:var(--c-text-lite)}
.mn-btn.small{height:28px;padding:0 12px;font-size:var(--f-sm)}
.mn-btn.primary{background:var(--c-text);border-color:var(--c-text);color:#fff}
.mn-btn.primary:hover{background:#000}
.mn-btn.on{background:var(--c-text);border-color:var(--c-text);color:#fff}
.mn-ico{min-width:28px;height:28px;padding:0 8px;border:1px solid var(--c-line);border-radius:var(--r-pill);background:#fff;font-size:var(--f-sm);transition:border-color var(--t-fast) var(--ease-out)}
.mn-ico:hover{border-color:var(--c-text-lite)}
.mn-ico.on{background:var(--c-text);border-color:var(--c-text);color:#fff}
.mn-ico:disabled{opacity:.35;pointer-events:none}
/* 顶栏 */
.mn-top{display:flex;align-items:center;gap:var(--s2);height:48px;padding:0 var(--s3);border-bottom:1px solid var(--c-line);background:#fbfaf7}
.mn-brand{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.mn-brand i{width:18px;height:14px;border-radius:3px;background:linear-gradient(#c49a6c 0 45%,transparent 45% 55%,#c49a6c 55%)}
.mn-name{color:var(--c-text-mid);max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mn-seg{display:inline-flex;border:1px solid var(--c-line);border-radius:var(--r-pill);padding:2px;background:var(--c-bg)}
.mn-seg button{border:0;background:none;height:24px;padding:0 10px;white-space:nowrap;border-radius:var(--r-pill);font-size:var(--f-sm);color:var(--c-text-mid);transition:background var(--t-fast) var(--ease-out),color var(--t-fast) var(--ease-out)}
.mn-seg button:hover{color:var(--c-text)}
.mn-seg button.on{background:var(--c-text);color:#fff}
.mn-chip{height:30px;padding:0 12px;border-radius:var(--r-pill);border:1px solid var(--c-line);background:#fff;font-weight:500;font-size:var(--f-sm);white-space:nowrap}
.mn-chip.ok{color:var(--c-accent);border-color:var(--c-accent);background:#e3f0eb}
.mn-chip.warn{color:#8a5a00;border-color:#d9a33a;background:#fdf3dd}
.mn-chip.bad{color:#b3261e;border-color:#d93025;background:#fdecea}
.mn-chip.nudge,.mn-issue.nudge{animation:mnNudge .4s var(--ease-out)}
@keyframes mnNudge{0%,100%{transform:none}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
/* 三栏 */
.mn-body{position:relative;flex:1;min-height:0;display:grid;grid-template-columns:248px minmax(0,1fr) 272px}
.mn-chat{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--c-line);background:#fbfaf7}
.mn-hd{padding:var(--s2) var(--s3) 0;font-weight:600}
.mn-msgs{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:var(--s2) var(--s3)}
.mn-msg{max-width:100%;padding:8px 10px;border-radius:var(--r);font-size:var(--f-sm);line-height:20px;white-space:pre-wrap}
.mn-msg.ai{background:#fff;border:1px solid var(--c-line);color:var(--c-text-mid)}
.mn-msg.me{align-self:flex-end;background:var(--c-text);color:#fff}
.mn-msg.think{color:var(--c-text-lite)}
.mn-msg.think::after{content:'';display:inline-block;width:6px;height:6px;margin-left:6px;border-radius:50%;background:var(--c-accent);animation:mnBlink 1s infinite}
@keyframes mnBlink{50%{opacity:.2}}
.mn-chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 var(--s3) var(--s1)}
.mn-chips button{height:26px;padding:0 10px;border:1px solid var(--c-accent);border-radius:var(--r-pill);background:#fff;color:var(--c-accent);font-size:var(--f-sm);transition:background var(--t-fast) var(--ease-out)}
.mn-chips button:hover{background:#e3f0eb}
.mn-in{margin:0 var(--s2) var(--s2);border:1px solid var(--c-line);border-radius:var(--r);background:#fff}
.mn-in textarea{display:block;width:100%;border:0;resize:none;padding:8px 10px;font:inherit;font-size:var(--f-sm);line-height:20px;background:none;outline:none}
.mn-in-ft{display:flex;align-items:center;gap:6px;padding:0 6px 6px 10px}
.mn-in-ft small{flex:1;color:var(--c-text-lite);font-size:var(--f-xs);line-height:14px}
/* 展开图 */
.mn-canvas{position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;background:#f1eee9}
.mn-sheetwrap{position:relative;flex:1;min-height:0;overflow:hidden;touch-action:none}
.mn-sheet{position:absolute;left:0;top:0;transform-origin:0 0;transition:transform .45s var(--mv)}
.mn-face{position:absolute;box-shadow:0 0 0 .5px rgba(30,33,36,.08)}
.mn-face::before{content:'';position:absolute;left:0;right:0;top:0;border-top:1px dashed rgba(14,122,95,.75);pointer-events:none;z-index:1}
.mn-safe{position:absolute;border:1px dotted rgba(30,33,36,.18);pointer-events:none}
.mn-flabel{position:absolute;left:0;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;text-align:right;font-size:var(--f-xs);line-height:14px;color:var(--c-text-lite)}
.mn-flabel b{font-size:var(--f-sm);color:var(--c-text-mid);font-weight:600}
.mn-glue{position:absolute;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(135deg,#f7f5f1 0 6px,#ebe7e0 6px 7px);font-size:var(--f-xs);color:var(--c-text-lite);overflow:hidden;white-space:nowrap}
.mn-cut{position:absolute;top:0;border:1.5px solid #e0533d;pointer-events:none}
.mn-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:var(--f-sm);color:var(--c-text-lite)}
.mn-el{position:absolute;transform:translate(-50%,-50%);white-space:pre-wrap;word-break:break-word;-webkit-user-drag:none;user-select:none;transition:opacity .3s var(--ease-out),transform .3s var(--ease-out)}
.mn-sheet .mn-el{cursor:grab;touch-action:none;outline:1.5px solid transparent;outline-offset:2px}
.mn-sheet .mn-el:hover{outline-color:rgba(14,122,95,.35)}
.mn-sheet .mn-el:focus-visible{outline-color:var(--c-accent)}
.mn-sheet .mn-el.sel{outline-color:var(--c-accent)}
.mn-sheet .mn-el.bad{outline-color:#d93025}
.mn-el.pop{opacity:0;transform:translate(-50%,-50%) scale(.85);transition:none}
.mn-tabs{display:flex;justify-content:center;gap:4px;padding:8px;border-top:1px solid var(--c-line);background:#fbfaf7;flex-wrap:wrap}
.mn-tabs button{height:28px;padding:0 12px;border:0;border-radius:var(--r-pill);background:none;color:var(--c-text-mid);font-size:var(--f-sm);transition:background var(--t-fast) var(--ease-out)}
.mn-tabs button:hover{background:#fff;color:var(--c-text)}
.mn-tabs button.on{background:var(--c-text);color:#fff}
.mn-issue{position:absolute;left:50%;bottom:56px;transform:translateX(-50%);display:flex;align-items:center;gap:var(--s2);max-width:calc(100% - 24px);padding:6px 6px 6px 14px;border-radius:var(--r-pill);background:#fff;box-shadow:var(--shadow);border:1px solid #d93025;font-size:var(--f-sm);z-index:2}
.mn-issue .warn{color:#8a5a00}
.mn-issue .error{color:#b3261e}
.mn-issue[hidden]{display:none}
/* 3D */
.mn-side{display:flex;flex-direction:column;min-height:0;border-left:1px solid var(--c-line);background:#fbfaf7}
.mn-view{display:flex;flex-direction:column;background:radial-gradient(120% 90% at 50% 40%,#fbfaf7,#ece8e1)}
.mn-3dtools{display:flex;align-items:center;gap:6px;padding:8px}
.mn-views{display:flex;gap:4px}
.mn-3d{position:relative;height:260px;perspective:900px;cursor:grab;touch-action:none;overflow:hidden}
.mn-3d:active{cursor:grabbing}
.mn-cube{position:absolute;left:50%;top:52%;width:0;height:0;transform-style:preserve-3d;transition:transform .6s var(--mv)}
.mn-cube.drag,.mn-cube.still,.mn-cube.still *{transition:none!important}
.mn-cube .mn-f,.mn-shadow{position:absolute;left:0;top:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.mn-print{overflow:hidden}
.mn-print::after{content:'';position:absolute;inset:0;pointer-events:none}
.shade-sideA::after{background:rgba(30,33,36,.07)}
.shade-sideB::after{background:rgba(255,255,255,.12)}
.shade-bigB::after{background:rgba(30,33,36,.05)}
.mn-paper{background:#efe9df}
/* 内盒：外面主题深色哑光，里面衬纸 + 细碎的皱纹纸，内盖印小图案 */
.mn-trayout{background-image:linear-gradient(160deg,rgba(255,255,255,.14),rgba(0,0,0,.12))}
.mn-trayin{background-image:linear-gradient(rgba(0,0,0,.06),rgba(0,0,0,0))}
.mn-floor{transform-style:preserve-3d;background-image:repeating-linear-gradient(28deg,rgba(255,255,255,.22) 0 1px,transparent 1px 4px),repeating-linear-gradient(-41deg,rgba(0,0,0,.035) 0 1px,transparent 1px 7px),radial-gradient(120% 100% at 50% 50%,rgba(255,255,255,.25),rgba(0,0,0,.1))}
.mn-lidin{display:flex;align-items:center;justify-content:center}
.mn-lidin img{max-width:34%;max-height:56%;opacity:.9}
.mn-shadow{background:radial-gradient(closest-side,rgba(30,33,36,.28),transparent);filter:blur(4px)}
.mn-tray,.mn-lid{position:absolute;left:0;top:0;transform-style:preserve-3d;transition:transform .6s var(--mv)}
.mn-lid{transform-origin:50% 0}
.mn-gifts{position:absolute;left:0;top:0;transform:translateZ(1px);transform-style:preserve-3d}
.mn-gift{position:absolute}
.mn-gift img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(30,20,10,.28))}
.mn-gift img.rot{left:50%;top:50%;transform:translate(-50%,-50%) rotate(90deg)}
.mn-packnote{margin:0 8px;padding:6px 10px;border-radius:var(--r);background:#fdf3dd;color:#8a5a00;font-size:var(--f-xs);line-height:16px}
.mn-packnote[hidden]{display:none}
/* 右下：选项 */
.mn-propwrap{flex:1;min-height:0;overflow:auto;border-top:1px solid var(--c-line)}
.mn-props{padding:var(--s2) var(--s3)}
.mn-phd{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.mn-phd small{color:var(--c-text-lite);font-size:var(--f-sm)}
.mn-hint{margin:0 0 var(--s2);font-size:var(--f-sm);line-height:20px;color:var(--c-text-lite)}
.mn-row{display:grid;grid-template-columns:52px minmax(0,1fr);gap:8px;align-items:start;margin-bottom:10px}
html[lang=en] .mn-row{grid-template-columns:76px minmax(0,1fr)}
.mn-lab{color:var(--c-text-mid);font-size:var(--f-sm);line-height:28px}
.mn-ctl{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:28px}
.mn-ctl textarea,.mn-ctl input:not([type=range]){width:100%;border:1px solid var(--c-line);border-radius:var(--r);padding:6px 8px;font:inherit;font-size:var(--f-sm);line-height:20px;resize:vertical;background:#fff}
.mn-ctl input[type=range]{width:100%;accent-color:var(--c-text)}
.mn-sw{width:22px;height:22px;border-radius:var(--r-pill);border:1px solid rgba(30,33,36,.2);padding:0;transition:transform var(--t-fast) var(--ease-out)}
.mn-sw:hover{transform:scale(1.1)}
.mn-sw.on{box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--c-text)}
.mn-pills{display:flex;flex-wrap:wrap;gap:6px}
.mn-pills button{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--c-line);border-radius:var(--r-pill);background:#fff;font-size:var(--f-sm);transition:border-color var(--t-fast) var(--ease-out)}
.mn-pills button:hover{border-color:var(--c-text-lite)}
.mn-pills button.on{background:var(--c-text);border-color:var(--c-text);color:#fff}
.mn-pills i{width:12px;height:12px;border-radius:var(--r-pill);border:2px solid}
/* 弹层 */
.mn-modal{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:var(--s3);background:rgba(241,238,233,.9);animation:mnIn .25s var(--ease-out)}
.mn-modal[hidden]{display:none}
@keyframes mnIn{from{opacity:0}to{opacity:1}}
.mn-mbox{width:min(760px,100%);max-height:100%;overflow:auto;background:#fff;border:1px solid var(--c-line);border-radius:var(--r);box-shadow:0 12px 40px rgba(30,33,36,.16)}
.mn-mhd{display:flex;align-items:center;gap:var(--s2);padding:var(--s2) var(--s3);border-bottom:1px solid var(--c-line)}
.mn-mhd span:not(.mn-sp){color:var(--c-text-lite);font-size:var(--f-sm)}
.mn-mbd{padding:var(--s3)}
.mn-shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2)}
.mn-shot{position:relative;display:flex;flex-direction:column;gap:6px;align-items:center}
.mn-shot img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r);animation:mnIn .4s var(--ease-out)}
.mn-shot b{font-weight:500;font-size:var(--f-sm)}
.mn-shot.loading .mn-shimmer{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:3/2;border-radius:var(--r);background:linear-gradient(100deg,#f1eee9 30%,#faf8f5 50%,#f1eee9 70%);background-size:300% 100%;animation:mnShim 1.4s linear infinite;color:var(--c-text-lite);font-size:var(--f-sm)}
@keyframes mnShim{from{background-position:100% 0}to{background-position:-100% 0}}
.mn-note{margin:var(--s2) 0 0;color:var(--c-text-lite);font-size:var(--f-sm)}
.mn-cardui{display:grid;grid-template-columns:220px minmax(0,1fr);gap:var(--s4);align-items:start}
.mn-card{display:flex;flex-direction:column;aspect-ratio:5/7;padding:6.4%;box-shadow:var(--shadow);border-radius:var(--r);overflow:hidden}
.mn-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.mn-card>i{width:22px;height:2px;margin:14px 0 8px}
.mn-cto{font-size:13px;margin-bottom:6px}
.mn-cmsg{font-size:16px;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.mn-cfrom{margin-top:auto;text-align:right;font-size:13px}
.mn-cardform{display:flex;flex-direction:column;gap:10px}
.mn-thumbs{display:flex;gap:6px}
.mn-thumbs button{width:64px;padding:0;border:2px solid transparent;border-radius:var(--r);overflow:hidden;background:none;transition:border-color var(--t-fast) var(--ease-out)}
.mn-thumbs button:hover{border-color:var(--c-line)}
.mn-thumbs button.on{border-color:var(--c-text)}
.mn-thumbs img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.mn-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.mn-phonewrap{display:flex;gap:var(--s4);align-items:center;justify-content:center}
.mn-phone{width:200px;height:400px;padding:10px;border-radius:34px;background:#1e2124;box-shadow:0 20px 50px rgba(30,33,36,.25);flex:none}
.mn-screen{width:100%;height:100%;border-radius:26px;background:radial-gradient(120% 80% at 50% 0%,#fbf9f5,#f2eee8 70%);display:flex;align-items:center;justify-content:center;perspective:900px;overflow:hidden}
.mn-flip{position:relative;width:150px;aspect-ratio:5/7;padding:0;border:0;background:none;transform-style:preserve-3d;transition:transform .5s var(--mv)}
.mn-flip.open{transform:rotateY(180deg)}
.mn-ff{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:3px;overflow:hidden;box-shadow:0 10px 30px rgba(30,33,36,.2)}
.mn-ff.front img{width:100%;height:100%;object-fit:cover}
.mn-ff.front span{position:absolute;left:0;right:0;bottom:0;padding:24px 10px 8px;background:linear-gradient(transparent,rgba(0,0,0,.45));color:#fff;font-size:12px;text-align:left}
.mn-ff.back{transform:rotateY(180deg)}
.mn-ff.back .mn-card{height:100%;box-shadow:none;border-radius:0;font-size:12px}
.mn-ff.back .mn-card img{display:none}
.mn-ff.back .mn-card>i{margin-top:24px}
.mn-ff.back .mn-cmsg{font-size:13px}
.mn-phoneside{max-width:260px}
.mn-phoneside p{margin:0 0 var(--s2);color:var(--c-text-mid);line-height:1.7}
.mn-order{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s4);align-items:start}
.mn-ordthumb{position:relative;overflow:hidden;background:#f1eee9;border-radius:var(--r)}
.mn-order ul{margin:0 0 var(--s3);padding-left:20px;color:var(--c-text-mid);line-height:1.9}
.mn-end{padding-top:var(--s2);border-top:1px solid var(--c-line)}
.mn-end b{display:block;font-size:var(--f-lg);font-weight:600;margin-bottom:4px}
.mn-end p{margin:0 0 var(--s2);color:var(--c-text-mid);line-height:1.7}
.mn-toast{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:6;padding:8px 14px;border-radius:var(--r-pill);background:var(--c-text);color:#fff;font-size:var(--f-sm);box-shadow:var(--shadow)}
.mn-toast[hidden]{display:none}
/* 设计助手：选场合、挑礼物 */
.mn-picker{padding:0 var(--s3) var(--s1);overflow:auto;flex:none;max-height:72%;min-height:0}
.mn-picker:empty{display:none}
.mn-q{margin:6px 0;font-size:var(--f-sm);font-weight:600;color:var(--c-text-mid)}
.mn-opts{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mn-opts button{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid var(--c-line);border-radius:var(--r);background:#fff;text-align:left;transition:border-color var(--t-fast) var(--ease-out),background var(--t-fast) var(--ease-out)}
.mn-opts button:hover{border-color:var(--c-text-lite)}
.mn-opts button.on{border-color:var(--c-text);box-shadow:inset 0 0 0 1px var(--c-text)}
.mn-opts i{flex:none;width:18px;height:18px;border-radius:var(--r-pill);border:3px solid}
.mn-opts span{display:flex;flex-direction:column;min-width:0}
.mn-opts b{font-size:var(--f-sm);font-weight:600;line-height:16px}
.mn-opts small{font-size:var(--f-xs);line-height:14px;color:var(--c-text-lite);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mn-giftopts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.mn-giftopts button{display:flex;align-items:center;gap:6px;height:34px;padding:0 6px;border:1px solid var(--c-line);border-radius:var(--r);background:#fff;font-size:var(--f-xs);line-height:13px;text-align:left;transition:border-color var(--t-fast) var(--ease-out)}
.mn-giftopts button:hover{border-color:var(--c-text-lite)}
.mn-giftopts button.on{border-color:var(--c-accent);background:#e3f0eb;box-shadow:inset 0 0 0 1px var(--c-accent)}
.mn-giftopts img{flex:none;width:26px;height:26px;object-fit:contain}
.mn-giftopts span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.mn-fit{margin:8px 0 6px;font-size:var(--f-xs);line-height:16px}
.mn-fit.ok{color:var(--c-accent)}
.mn-fit.no{color:#8a5a00}
.mn-go{width:100%;position:sticky;bottom:0;box-shadow:0 -8px 12px #fbfaf7}
.mn-note2{display:block;padding:6px var(--s3) 10px;color:var(--c-text-lite);font-size:var(--f-xs);line-height:14px}
/* 展开图上方：加文字 / 加插画；素材面板 */
.mn-tools{display:flex;gap:6px;padding:8px;border-bottom:1px solid var(--c-line);background:#fbfaf7}
.mn-tools .mn-btn:disabled{opacity:.4;pointer-events:none}
.mn-assets{position:absolute;left:8px;top:48px;z-index:3;width:min(300px,calc(100% - 16px));max-height:calc(100% - 110px);overflow:auto;padding:var(--s2);background:#fff;border:1px solid var(--c-line);border-radius:var(--r);box-shadow:0 12px 32px rgba(30,33,36,.16)}
.mn-assets[hidden]{display:none}
.mn-ahd{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:var(--f-sm)}
.mn-ahd b{flex:1;font-weight:600}
.mn-agrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.mn-agrid.small{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
.mn-agrid button{aspect-ratio:1;padding:4px;border:1px solid var(--c-line);border-radius:var(--r);background:#faf8f5;transition:border-color var(--t-fast) var(--ease-out)}
.mn-agrid button:hover{border-color:var(--c-text-lite)}
.mn-agrid button.on{border-color:var(--c-text);box-shadow:inset 0 0 0 1px var(--c-text)}
.mn-agrid img{width:100%;height:100%;object-fit:contain}
.mn-lines{display:flex;flex-direction:column;gap:4px;width:100%}
.mn-lines button{padding:4px 8px;border:1px solid var(--c-line);border-radius:var(--r);background:#fff;font-size:var(--f-sm);line-height:18px;text-align:left;transition:border-color var(--t-fast) var(--ease-out)}
.mn-lines button:hover{border-color:var(--c-text-lite)}
.mn-lines button.on{border-color:var(--c-text);box-shadow:inset 0 0 0 1px var(--c-text)}
.mn-link{border:0;background:none;padding:0;color:var(--c-text-lite);font-size:var(--f-sm);text-decoration:underline;text-underline-offset:2px}
.mn-link:hover{color:#b3261e}
.mn-sw.duo{width:30px;height:30px}
/* 引导：圈出要点的地方、假鼠标、底下一条说明 */
.mn-ring{position:absolute;left:0;top:0;z-index:8;border:2px solid var(--c-accent);border-radius:var(--r);pointer-events:none;transition:transform .25s var(--ease-out),width .25s var(--ease-out),height .25s var(--ease-out);animation:mnPulse 1.8s var(--ease-out) infinite}
.mn-ring[hidden]{display:none}
@keyframes mnPulse{0%{box-shadow:0 0 0 0 rgba(14,122,95,.45)}70%{box-shadow:0 0 0 12px rgba(14,122,95,0)}100%{box-shadow:0 0 0 0 rgba(14,122,95,0)}}
.mn-cursor{position:absolute;left:0;top:0;z-index:9;width:22px;height:22px;pointer-events:none;opacity:0;transition:transform .6s var(--mv),opacity var(--t-mid) var(--ease-out);filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
.mn-cursor.on{opacity:1}
.mn-cursor.slow{transition:opacity var(--t-mid) var(--ease-out)}
.mn-cursor svg{display:block;width:22px;height:22px}
.mn-ripple{position:absolute;z-index:9;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:var(--r-pill);background:rgba(14,122,95,.35);pointer-events:none;animation:mnRipple .45s var(--ease-out) forwards}
@keyframes mnRipple{from{transform:scale(.2);opacity:1}to{transform:scale(1.6);opacity:0}}
.mn-cap{display:flex;align-items:center;gap:var(--s3);min-height:60px;padding:var(--s1) var(--s3);border-top:1px solid var(--c-line);background:#fff}
.mn-captxt{flex:1;min-width:0}
.mn-captxt b{font-weight:600}
.mn-capn{color:var(--c-text-lite);font-size:var(--f-sm)}
.mn-captxt>span{display:block;color:var(--c-text-mid);font-size:var(--f-md)}
.mn-cap .mn-btn[hidden]{display:none}
.mn-mtabs{display:none}
/* 右边：步骤清单 */
.mn-steps{list-style:none;margin:0;padding:0;border-left:1px solid var(--c-line)}
.mn-steps button{position:relative;display:flex;align-items:center;gap:var(--s2);width:100%;border:0;background:none;padding:6px var(--s3);font:inherit;font-size:var(--f-md);color:var(--c-text-lite);text-align:left;cursor:pointer;transition:color var(--t-fast) var(--ease-out),background var(--t-fast) var(--ease-out)}
.mn-steps button:hover{color:var(--c-text);background:#fff}
.mn-steps i{flex:none;width:22px;height:22px;border-radius:var(--r-pill);border:1px solid var(--c-line);display:inline-flex;align-items:center;justify-content:center;font:500 var(--f-sm)/1 var(--num);font-style:normal}
.mn-steps .done button{color:var(--c-text-mid)}
.mn-steps .done i{background:var(--c-accent);border-color:var(--c-accent);color:#fff}
.mn-steps .on button{color:var(--c-text);font-weight:600}
.mn-steps .on button::before{content:'';position:absolute;left:-1px;top:4px;bottom:4px;width:2px;background:var(--c-accent)}
.mn-steps .on i{border-color:var(--c-accent);color:var(--c-accent);background:#fff}
@media (max-width:1180px){.mn-body{grid-template-columns:190px minmax(0,1fr) 250px}.mn-name{display:none}}
@media (max-width:960px){
  .mini{grid-template-columns:minmax(0,1fr);gap:var(--s3)}
  .mn-steps{display:flex;gap:4px;overflow-x:auto;min-width:0;border-left:0;order:-1;scrollbar-width:none}
  .mn-steps li{flex:none}
  .mn-steps button{padding:6px 10px;border-radius:var(--r-pill);white-space:nowrap}
  .mn-steps .on button::before{display:none}
  .mn-steps .on button{background:#fff;box-shadow:inset 0 0 0 1px var(--c-accent)}
}
/* 手机：一次一块，底下三个标签切换（跟真编辑器一样） */
@media (max-width:760px){
  .mn-win{height:auto}
  .mn-url{display:none}
  .mn-top{gap:6px;padding:0 var(--s2);overflow-x:auto;scrollbar-width:none}
  .mn-brand,.mn-name,.mn-top .mn-ico{display:none}
  .mn-body{display:flex;flex-direction:column;flex:none;height:500px}
  .mn-chat,.mn-canvas,.mn-side{flex:1;min-height:0;border:0}
  .mn-win[data-pane=canvas] .mn-chat,.mn-win[data-pane=view] .mn-chat,.mn-win[data-pane=chat] .mn-canvas,.mn-win[data-pane=view] .mn-canvas,.mn-win[data-pane=chat] .mn-side{display:none}
  /* 改盒面：上面展开图、下面选项，各占一块，不互相盖 */
  .mn-win[data-pane=canvas] .mn-side{flex:none;max-height:42%;border-top:1px solid var(--c-line)}
  .mn-win[data-pane=canvas] .mn-view{display:none}
  .mn-win[data-pane=canvas] .mn-propwrap{border-top:0}
  .mn-win[data-pane=view] .mn-propwrap{display:none}
  .mn-win[data-pane=view] .mn-view{flex:1;min-height:0}
  .mn-win[data-pane=view] .mn-3d{flex:1;height:auto}
  .mn-issue{bottom:auto;top:8px}
  .mn-picker{max-height:none;flex:1 1 auto}
  .mn-win[data-pane=chat] .mn-msgs{flex:none;max-height:34%}
  .mn-mtabs{display:flex;border-top:1px solid var(--c-line)}
  .mn-mtabs button{flex:1;height:44px;border:0;background:#fff;color:var(--c-text-lite);font-weight:500}
  .mn-mtabs button.on{color:var(--c-text);box-shadow:inset 0 2px 0 var(--c-accent)}
  .mn-cap{flex-wrap:wrap;gap:var(--s1)}
  .mn-shots{grid-template-columns:minmax(0,1fr)}
  .mn-cardui,.mn-order{grid-template-columns:minmax(0,1fr)}
  .mn-cardprev{max-width:220px;margin:0 auto}
  .mn-phonewrap{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  .mn-sheet,.mn-cube,.mn-tray,.mn-lid,.mn-flip,.mn-cursor,.mn-el{transition:none}
  .mn-ring,.mn-shimmer,.mn-msg.think::after{animation:none}
}
