@font-face{font-family:"UI Sans";src:url(../fonts/noto-sans-sc-regular-sub.woff2?v=3) format("woff2");font-weight:100 550;font-display:swap}
@font-face{font-family:"UI Sans";src:url(../fonts/noto-sans-sc-bold-sub.woff2?v=3) format("woff2");font-weight:551 900;font-display:swap}
@font-face{font-family:"Smiley Sans";src:url(../fonts/smiley-sans-sub.woff2?v=3) format("woff2");font-display:swap}
@font-face{font-family:"UI Serif";src:url(../fonts/noto-serif-sc-regular-sub.woff2?v=1) format("woff2");font-weight:100 550;font-display:swap}
@font-face{font-family:"UI Serif";src:url(../fonts/noto-serif-sc-bold-sub.woff2?v=1) format("woff2");font-weight:551 900;font-display:swap}
@font-face{font-family:"Inter Sub";src:url(../fonts/inter-sub.woff2?v=1) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Playfair Sub";src:url(../fonts/playfair-sub.woff2?v=1) format("woff2");font-weight:400 900;font-display:swap}
[hidden]{display:none!important}
:root{
  --blue:#0D99FF; --blue-d:#0A7FD6; --primary:#2563EB; --primary-d:#1D4ED8; --ok:#14AE5C; --red:#F24822; --purple:#9747FF; --ink:#1F2329; --ink2:#646A73; --line:#E5E6EB;
  --sh-1:0 1px 2px rgba(31,35,41,.08),0 0 0 1px rgba(31,35,41,.04); --sh-2:0 6px 20px rgba(31,35,41,.10),0 0 0 1px rgba(31,35,41,.04); --sh-3:0 24px 64px rgba(31,35,41,.22),0 0 0 1px rgba(31,35,41,.05);
  --ease:cubic-bezier(.2,.8,.2,1); --spring:cubic-bezier(.34,1.56,.64,1);
  --display:"Smiley Sans","得意黑",var(--font);
  --panel:#FFFFFF; --tb:#2C2C2C; --canvas:#EDEDED;
  --font: "UI Sans", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Noto Sans SC", sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased}
button{font-family:inherit;cursor:pointer}
kbd{font-family:inherit;font-size:10px;background:#F1F1F1;border:1px solid #DDD;border-bottom-width:2px;border-radius:4px;padding:0 4px;color:#333}
.scene{position:fixed;inset:0;z-index:0;background:#E9EDF3}
.scene-layer{position:absolute;inset:0;opacity:0;transition:opacity .6s ease}
.scene-layer.on{opacity:1}
.scene-layer svg{width:100%;height:100%;display:block}
#app{position:fixed;inset:0;z-index:1}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:#1E1E1E;color:#fff;font-size:13px;padding:8px 14px;border-radius:10px;opacity:0;pointer-events:none;transition:.2s;z-index:99}
.toast.on{opacity:1;transform:translate(-50%,0)}
.logo{display:inline-block;width:16px;height:16px;border-radius:6px;background:var(--blue);position:relative;flex:none}
.logo::after{content:"";position:absolute;inset:4px;border-radius:2px;background:#fff}
.logo.big{width:44px;height:44px;border-radius:12px;box-shadow:0 6px 18px rgba(37,99,235,.35)}
.logo.big::after{inset:12px;border-radius:4px}

/* ---------- 地图 ---------- */
.map{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto}
.map-card{width:min(980px,100%);background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-radius:16px;padding:32px 36px;box-shadow:0 30px 80px rgba(30,40,60,.18);margin:auto}
.title-row{display:flex;gap:14px;align-items:center}
.title-row h1{margin:0;font-size:30px;letter-spacing:1px}
.title-row p{margin:2px 0 0;color:var(--ink2);font-size:14px}
.pitch{color:#444;font-size:14px;line-height:1.7;margin:16px 0}
.fund{background:#F5F9FF;border:1px solid #D9EBFF;border-radius:12px;padding:12px 16px;margin:12px 0 20px}
.fund-top{display:flex;align-items:center;gap:10px}
.fund-t{font-size:12px;color:var(--ink2)}
.fund-v{font-size:14px;color:#555}.fund-v b{font-size:20px;color:var(--ink);font-variant-numeric:tabular-nums}
.bar{height:8px;background:#E3ECF7;border-radius:99px;margin-top:10px;overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,#0D99FF,#9747FF);border-radius:99px;transition:width 1s cubic-bezier(.2,.8,.2,1)}
.levels{display:flex;align-items:stretch;gap:0}
.lv-link{flex:0 0 18px;align-self:center;height:2px;background:repeating-linear-gradient(90deg,#B8C4D4 0 4px,transparent 4px 8px)}
.lv{flex:1;min-width:0;text-align:left;border:1px solid var(--line);background:#fff;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:4px;transition:transform .15s,box-shadow .15s,border-color .15s;position:relative}
.lv:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.08);border-color:var(--blue)}
.lv.cafe{background:#FFFAF3}
.lv-n{font-size:12px;font-weight:700;color:var(--blue)}
.lv.cafe .lv-n{color:#B5651D}
.lv-place{font-size:11px;color:var(--ink2)}
.lv-t{font-size:16px;font-weight:700;margin-top:6px}
.lv-c{font-size:12px;color:var(--ink2)}
.lv-f{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:12px;color:#555}
.lv-f svg{border-radius:50%}
.lv-f em{margin-left:auto;font-style:normal;font-weight:700;color:#22A06B}
.lv.lock{opacity:.5;cursor:not-allowed}.lv.lock em{color:#999}
.lv.done::after{content:"✓";position:absolute;top:10px;right:12px;width:20px;height:20px;border-radius:50%;background:#22C55E;color:#fff;font-size:12px;display:grid;place-items:center}
.lv.done em{color:var(--ink2)}
.map-foot{display:flex;gap:16px;margin-top:18px}
.link{background:none;border:0;color:var(--ink2);font-size:12px;padding:0;text-decoration:underline;text-underline-offset:3px}
.mobile-tip{display:none;margin-top:12px;font-size:12px;color:#B5651D}
.end{text-align:center;max-width:620px}
.end h1{margin:6px 0 0;font-size:28px}
.end-tag{display:inline-block;background:#1E1E1E;color:#fff;font-size:12px;padding:4px 10px;border-radius:99px}
.end .fund{text-align:left}
.teaser{border:1px dashed #C9B8F5;background:#FAF7FF;border-radius:12px;padding:16px;margin:8px 0 18px}
.teaser-k{font-size:12px;color:var(--purple);font-weight:700}
.teaser-t{font-size:22px;font-weight:800;margin:4px 0}
.teaser p{margin:6px 0;font-size:14px;color:#444}
.teaser-s{font-size:12px;color:var(--ink2)}

/* ---------- 对话 ---------- */
.talk{position:absolute;inset:0;cursor:pointer;display:flex;align-items:flex-end;justify-content:center;padding:0 24px 40px;background:linear-gradient(transparent 50%,rgba(0,0,0,.18))}
.skip{position:absolute;top:20px;right:24px;background:rgba(30,30,30,.7);color:#fff;border:0;border-radius:99px;padding:6px 14px;font-size:13px}
.tbox{width:min(760px,100%);background:#fff;border-radius:16px;padding:20px 22px;display:flex;gap:18px;box-shadow:0 20px 60px rgba(0,0,0,.25);position:relative}
.tav svg{border-radius:50%;display:block}
.tmain{flex:1;min-width:0}
.tname{font-weight:800;font-size:15px;color:var(--blue);margin-bottom:6px}
.talk.narr .tname{color:#777}
.talk.narr .ttext{font-style:normal;color:#555}
.ttext{font-size:18px;line-height:1.6;min-height:58px}
.tnext{position:absolute;right:20px;bottom:12px;font-size:12px;color:#aaa}
.tchoices{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.choice{display:flex;gap:10px;align-items:center;text-align:left;font-size:15px;border:1px solid var(--line);background:#F8F9FB;border-radius:10px;padding:10px 12px;transition:.15s}
.choice b{width:22px;height:22px;border-radius:6px;background:var(--blue);color:#fff;display:grid;place-items:center;font-size:12px;flex:none}
.choice:hover{border-color:var(--blue);background:#EEF7FF;transform:translateX(3px)}

/* ---------- 编辑器窗口 ---------- */
.stage{position:absolute;inset:0;padding:22px 28px 26px;display:flex}
.win{flex:1;display:flex;flex-direction:column;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 30px 80px rgba(20,30,50,.28);min-width:0}
.tb{height:44px;background:var(--tb);color:#fff;display:flex;align-items:center;gap:6px;padding:0 8px;flex:none;font-size:13px}
.tb-btn{height:32px;min-width:32px;border:0;background:transparent;color:#E6E6E6;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:0 8px;font-size:12px}
.tb-btn svg,.tool svg{width:16px;height:16px}
.tb-btn:hover{background:#3d3d3d}
.brand{display:flex;align-items:center;gap:8px;font-weight:700;padding:0 10px 0 4px;border-right:1px solid #444;height:24px}
.tools{display:flex;gap:2px;padding:0 6px}
.tool{width:32px;height:32px;border:0;border-radius:6px;background:transparent;color:#ddd;display:grid;place-items:center}
.tool.on{background:var(--blue);color:#fff}.tool:disabled{opacity:.4;cursor:default}
.tb-title{flex:1;text-align:center;color:#bbb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-title b{color:#fff;font-weight:600}.tb-title .sep{margin:0 6px;color:#666}
.tb-right{display:flex;align-items:center;gap:2px}
.ship{height:30px;border:0;border-radius:6px;background:var(--blue);color:#fff;font-weight:700;padding:0 16px;margin-left:6px;font-size:13px;transition:.15s}
.ship:hover{background:var(--blue-d)}
.ship.spot-el{animation:pulse 1.2s infinite}
.body{flex:1;display:flex;min-height:0}
.left,.right{background:var(--panel);flex:none;overflow:auto;font-size:12px}
.left{width:232px;border-right:1px solid var(--line);display:flex;flex-direction:column}
.right{width:248px;border-left:1px solid var(--line)}
.ptitle{font-size:11px;font-weight:700;padding:12px 14px 6px;color:#333}
.ptitle.sm{padding:12px 0 6px}
.layers{flex:1;overflow:auto;padding-bottom:8px;min-height:90px}
.ly{display:flex;align-items:center;gap:6px;height:28px;padding-right:10px;color:#333;cursor:default;border-radius:0;user-select:none}
.ly i{width:16px;height:16px;color:#8C8C8C;display:grid;place-items:center}.ly i svg{width:14px;height:14px}
.ly span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ly em{font-style:normal;color:#aaa;font-size:10px}
.ly.board{font-weight:700}.ly.board i{color:#333}
.ly.hov{box-shadow:inset 0 0 0 1px var(--blue)}
.ly.on{background:#E5F4FF}.ly.on i{color:var(--blue)}
.ly.al i{color:var(--purple)}
.ly.locked{color:#AAA}
.ly[data-id]:hover{box-shadow:inset 0 0 0 1px var(--blue)}
.brief{border-top:1px solid var(--line);padding:12px 14px 14px;background:#FCFCFD}
.brief-head{display:flex;gap:10px;align-items:center}
.brief-head svg{border-radius:50%;flex:none}
.bn{font-weight:700;font-size:13px}.bn span{font-weight:400;color:var(--ink2);margin-left:6px;font-size:11px}
.concept{font-size:11px;color:var(--purple);margin-top:2px;font-weight:600}
.quote{margin-top:10px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:9px 10px;font-size:13px;line-height:1.55;position:relative}
.quote::before{content:"";position:absolute;top:-6px;left:14px;width:10px;height:10px;background:#fff;border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
.rules{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.rules li{display:flex;gap:8px;align-items:flex-start;line-height:1.45;color:#444}
.rules li i{width:14px;height:14px;border-radius:50%;border:1.5px solid #C4C4C4;flex:none;margin-top:1px;position:relative;transition:.2s}
.rules li.ok{color:#1E1E1E}
.rules li.ok i{background:#14AE5C;border-color:#14AE5C}
.rules li.ok i::after{content:"";position:absolute;left:3.5px;top:1px;width:3px;height:6px;border:solid #fff;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.rules li.pop i{animation:pop .35s ease-out}
@keyframes pop{0%{transform:scale(.4)}60%{transform:scale(1.35)}100%{transform:scale(1)}}

/* 画布 */
.canvas{flex:1;position:relative;overflow:hidden;background-color:var(--canvas);background-image:radial-gradient(circle,#C9C9C9 1px,transparent 1.2px);background-size:16px 16px;min-width:0;user-select:none;touch-action:none}
.canvas.dragging{cursor:default}
.world{position:absolute;left:0;top:0;transform-origin:0 0}
.abwrap{position:absolute;left:0;top:0}
.ab-label{position:absolute;top:-22px;left:0;font-size:12px;color:#777;white-space:nowrap;display:flex;gap:6px;align-items:center}
.ai-chip,.me-chip{font-size:11px;padding:1px 7px;border-radius:99px;color:#fff;background:linear-gradient(90deg,#FF6CAB,#7366FF)}
.me-chip{background:#1E1E1E}
.artboard{position:relative;box-shadow:0 1px 3px rgba(0,0,0,.12),0 6px 24px rgba(0,0,0,.06)}
.artboard.static{pointer-events:none}
.node{position:absolute;box-sizing:border-box}
.node.text{white-space:nowrap;line-height:1.3}
.node.rect,.node.frame{display:flex;align-items:center;justify-content:center;transition:border-radius .08s}
.node .lbl{white-space:nowrap;pointer-events:none}
.node.image{overflow:hidden}
.node.image svg{width:100%;height:100%;display:block;pointer-events:none}
.node.zone{border:1.5px dashed #9AA4B2;background:repeating-linear-gradient(135deg,rgba(37,99,235,.04) 0 8px,transparent 8px 16px);pointer-events:none}
.node.zone::after{content:attr(data-zt);position:absolute;inset:0;display:grid;place-items:center;font-size:12px;color:#9AA4B2}
.node.frame{display:block}
.node.lifted{z-index:5;opacity:.9;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.zoomtag{position:absolute;right:10px;bottom:10px;font-size:11px;color:#777;background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px 6px}

/* 覆盖层 */
.overlay{position:absolute;inset:0;pointer-events:none}
.overlay>*{position:absolute}
.ov-hover{border:1.5px solid var(--blue);pointer-events:none}
.ov-hover.al{border-color:var(--purple)}
.ov-sel{border:1.5px solid var(--blue)}
.ov-sel.al{border-color:var(--purple)}
.ov-sel.multi{border-style:solid;opacity:.6}
.ov-size{transform:translateX(-50%);background:var(--blue);color:#fff;font-size:11px;padding:2px 6px;border-radius:4px;white-space:nowrap;font-variant-numeric:tabular-nums}
.ov-size.al{background:var(--purple)}
.ov-tag{font-size:11px;color:#fff;background:var(--purple);border-radius:4px;padding:2px 6px;display:flex;align-items:center;gap:4px;white-space:nowrap}
.ov-tag svg{width:12px;height:12px}
.ov-tip{font-size:11px;color:var(--purple);white-space:nowrap}
.ov-pad{background:repeating-linear-gradient(135deg,rgba(151,71,255,.22) 0 2px,rgba(151,71,255,.08) 2px 6px)}
.ov-gap{background:repeating-linear-gradient(135deg,rgba(242,72,34,.28) 0 2px,rgba(242,72,34,.08) 2px 6px)}
.h-rs{width:9px;height:9px;margin:-4.5px 0 0 -4.5px;background:#fff;border:1.5px solid var(--blue);pointer-events:auto;border-radius:1px}
.h-rs:hover{background:var(--blue)}
.h-rad{width:9px;height:9px;margin:-4.5px 0 0 -4.5px;background:#fff;border:1.5px solid var(--blue);border-radius:50%;pointer-events:auto;cursor:pointer;transition:transform .12s}
.h-rad:hover,.h-rad.on{transform:scale(1.35);background:var(--blue)}
.ov-pill{background:var(--blue);color:#fff;font-size:11px;padding:2px 6px;border-radius:4px;white-space:nowrap}
.gl{background:var(--red)}
.gl.v{width:1px}.gl.h{height:1px}
.gl{animation:fadein .12s ease-out}
.ms{display:flex;align-items:center;justify-content:center}
.ms.h{height:1px;background:var(--red)}.ms.v{width:1px;background:var(--red)}
.ms.h::before,.ms.h::after{content:"";position:absolute;top:-3px;width:1px;height:7px;background:var(--red)}
.ms.h::before{left:0}.ms.h::after{right:0}
.ms.v::before,.ms.v::after{content:"";position:absolute;left:-3px;height:1px;width:7px;background:var(--red)}
.ms.v::before{top:0}.ms.v::after{bottom:0}
.ms i{font-style:normal;background:var(--red);color:#fff;font-size:10px;padding:1px 4px;border-radius:3px;font-variant-numeric:tabular-nums;white-space:nowrap}
.ms.h i{transform:translateY(-11px)}.ms.v i{transform:translateX(16px)}
.ins{background:var(--purple);box-shadow:0 0 0 1px #fff}
.ins.h{height:3px;margin-top:-1.5px;border-radius:2px}.ins.v{width:3px;margin-left:-1.5px;border-radius:2px}
.ov-marq{border:1px solid var(--blue);background:rgba(37,99,235,.08)}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.spot{border:2px solid #FFB020;box-shadow:0 0 0 6px rgba(255,176,32,.2);animation:breathe 1.4s ease-in-out infinite}
.spot-dot{width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;border:2px solid #FFB020;animation:breathe 1.2s ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:.4;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
.spot-el{position:relative;animation:pulse 1.2s infinite;z-index:2}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,176,32,.7)}100%{box-shadow:0 0 0 10px rgba(255,176,32,0)}}

/* 教学提示 */
.coach{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);background:#1E1E1E;color:#fff;border-radius:12px;padding:10px 14px 12px;font-size:14px;max-width:min(520px,90%);box-shadow:0 10px 30px rgba(0,0,0,.2);z-index:4;display:flex;flex-direction:column;gap:6px;pointer-events:none}
.c-step{font-size:11px;color:#FFB020;font-weight:700}
.c-txt{line-height:1.5}.c-txt b{color:#7CC8FF}
.c-dots{display:flex;gap:4px}.c-dots b{width:16px;height:3px;border-radius:2px;background:#555}.c-dots b.d{background:#14AE5C}.c-dots b.c{background:#FFB020}

/* 检查器 */
.insp{padding-bottom:20px}
.sec{border-bottom:1px solid var(--line);padding:10px 12px 12px}
.sec.head{display:flex;align-items:center;gap:6px;font-size:12px}
.sec.head i{width:16px;height:16px;color:#888}.sec.head i svg{width:14px;height:14px}
.al-badge{margin-left:auto;font-size:10px;color:#fff;background:var(--purple);border-radius:4px;padding:1px 5px}
.sh{font-size:11px;font-weight:700;color:#333;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.sh em{font-style:normal;font-weight:400;color:var(--purple);font-size:10px;margin-left:auto}
.sh.sub{margin:10px 0 6px}
.kv{display:flex;justify-content:space-between;color:#444}.kv em{font-style:normal;color:#888}
.tips p{margin:0 0 6px;color:#555;line-height:1.6}
.grid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px}
.grid2>*{min-width:0}
.right{overflow-x:hidden}
.nf{display:flex;align-items:center;height:28px;border:1px solid transparent;border-radius:6px;background:#F5F5F5;transition:border-color .1s}
.nf:hover{border-color:#DDD}
.nf:focus-within{border-color:var(--blue);background:#fff}
.nf-l{padding:0 6px 0 8px;color:#8C8C8C;cursor:ew-resize;display:flex;align-items:center;gap:3px;height:100%;white-space:nowrap;font-size:11px}
.nf-l:hover,.nf.scrub .nf-l{color:var(--blue)}
.nf input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:12px;height:100%;outline:none;color:#1E1E1E;font-variant-numeric:tabular-nums;padding-right:6px}
.nf.dis{opacity:.45}.nf.dis .nf-l{cursor:default}
.nf.scrub{border-color:var(--blue);background:#fff}
body.scrubbing,body.scrubbing *{cursor:ew-resize!important}
.note{font-size:11px;color:#999;margin-top:6px}
.seg{display:flex;background:#F5F5F5;border-radius:6px;padding:2px;gap:2px;margin-top:8px}
.sec>.seg:first-of-type{margin-top:0}
.seg button{flex:1;height:26px;border:0;background:transparent;border-radius:4px;color:#555;font-size:11px;display:flex;align-items:center;justify-content:center;gap:3px}
.seg button svg{width:14px;height:14px}
.seg button:hover{background:#ECECEC}
.seg button.on{background:#fff;color:#1E1E1E;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.alsec .seg button.on{color:var(--purple)}
.alsec .sh{color:var(--purple)}
.alsec .grid2{margin-top:8px}
.rm-al{margin-left:auto;border:0;background:none;color:#999;font-size:10px}
.add-al{width:100%;height:30px;border:1px dashed #C9B8F5;background:#FAF7FF;color:var(--purple);border-radius:6px;font-size:12px;display:flex;align-items:center;justify-content:center;gap:6px}
.add-al svg{width:14px;height:14px}
.add-al:hover{background:#F2EBFF}
.sw{display:grid;grid-template-columns:repeat(9,1fr);gap:4px}
.sw button{aspect-ratio:1;border-radius:6px;border:1px solid rgba(0,0,0,.12);background:var(--c);padding:0;transition:transform .1s}
.sw button:hover{transform:scale(1.12)}
.sw button.on{box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--blue)}
.hexrow{display:flex;align-items:center;gap:6px;margin-top:6px;background:#F5F5F5;border-radius:6px;height:26px;padding:0 6px;border:1px solid transparent}
.hexrow:focus-within{border-color:var(--blue);background:#fff}
.hexrow .chip{width:14px;height:14px;border-radius:3px;border:1px solid rgba(0,0,0,.15)}
.hex{border:0;background:transparent;font:inherit;font-size:12px;outline:none;width:100%}

/* 试用 */
.sim{position:absolute;inset:0;z-index:6;background:rgba(255,255,255,.04)}
.sim-bar{position:absolute;top:12px;left:50%;transform:translateX(-50%);background:#fff;border-radius:99px;padding:6px 14px;font-size:13px;box-shadow:0 6px 20px rgba(0,0,0,.12);display:flex;align-items:center;gap:8px}
.rec{width:8px;height:8px;border-radius:50%;background:var(--red);animation:blink 1s infinite}
@keyframes blink{50%{opacity:.2}}
.cur{position:absolute;left:0;top:0;transition-property:transform;transition-timing-function:cubic-bezier(.45,.05,.25,1)}
.cur>svg{position:absolute;left:-3px;top:-2px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.3))}
.cur .who{position:absolute;left:16px;top:16px}
.cur .who svg{border-radius:50%;box-shadow:0 0 0 2px #fff,0 2px 6px rgba(0,0,0,.2);display:block}
.say{position:absolute;left:44px;top:12px;background:#1E1E1E;color:#fff;font-size:13px;padding:6px 10px;border-radius:10px;white-space:nowrap;opacity:0;transform:scale(.9);transform-origin:left center;transition:.18s}
.say.on{opacity:1;transform:none}
.say.happy{background:#14AE5C}.say.sad{background:var(--red)}.say.confused{background:#8A5CF6}
.ripple{position:absolute;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;border:2px solid var(--blue);animation:rip .6s ease-out forwards}
.ripple.miss{border-color:var(--red)}
@keyframes rip{from{transform:scale(.2);opacity:1}to{transform:scale(1.4);opacity:0}}
.win.simming .left,.win.simming .right,.win.simming .tb-right{opacity:.5;pointer-events:none;transition:opacity .2s}
.flaws{position:absolute;inset:0;pointer-events:none}
.flaw{position:absolute;display:flex;align-items:center;gap:4px;background:var(--red);color:#fff;font-size:12px;padding:2px 8px 2px 2px;border-radius:99px;white-space:nowrap;animation:flawin .3s backwards;box-shadow:0 4px 10px rgba(242,72,34,.35)}
.flaw b{width:18px;height:18px;border-radius:50%;background:#fff;color:var(--red);display:grid;place-items:center;font-size:11px}
@keyframes flawin{from{opacity:0;transform:scale(.6)}}

/* 弹窗 */
.modal{position:fixed;inset:0;background:rgba(20,20,30,.35);display:grid;place-items:center;z-index:50;animation:fadein .2s;padding:16px}
.modal.out{opacity:0;transition:.2s}
.m-card{background:#fff;border-radius:16px;padding:24px;width:min(440px,100%);box-shadow:0 30px 80px rgba(0,0,0,.3);position:relative;animation:rise .28s cubic-bezier(.2,.9,.3,1.2);max-height:calc(100vh - 32px);overflow:auto}
@keyframes rise{from{transform:translateY(16px) scale(.97);opacity:0}}
.m-badge{display:inline-block;font-weight:800;font-size:20px;padding:4px 12px;border-radius:10px;margin-bottom:14px}
.m-badge.win{background:#E7F8EE;color:#14AE5C}.m-badge.fail{background:#FFEDE8;color:var(--red)}
.m-say{display:flex;gap:12px;align-items:flex-start;background:#F7F7F8;border-radius:12px;padding:12px}
.m-say svg{border-radius:50%;flex:none}
.m-say b{font-size:13px}.m-say p{margin:4px 0 0;font-size:15px;line-height:1.5}
.m-rules{list-style:none;padding:0;margin:14px 0;display:flex;flex-direction:column;gap:6px;font-size:13px}
.m-rules li{display:flex;gap:8px;align-items:center}
.m-rules li i{width:16px;height:16px;border-radius:50%;flex:none;display:grid;place-items:center;font-style:normal;color:#fff;font-size:10px}
.m-rules li.ok i{background:#14AE5C}.m-rules li.ok i::after{content:"✓"}
.m-rules li.no i{background:var(--red)}.m-rules li.no i::after{content:"×"}
.m-rules li.no{font-weight:600}
.m-reward{margin:16px 0 0;font-size:14px;color:#555}.m-reward b{color:#14AE5C;font-size:20px;margin-left:4px}
.m-btns{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}
.btn{height:36px;border-radius:10px;border:0;padding:0 16px;font-size:14px;font-weight:600}
.btn.primary{background:var(--blue);color:#fff}.btn.primary:hover{background:var(--blue-d)}
.btn.ghost{background:#F1F1F1;color:#333}
.m-hint .m-h{display:flex;align-items:center;gap:10px}.m-hint .m-h svg{border-radius:50%}
.m-hint p{font-size:14px;line-height:1.7;color:#333}
.m-hint .btn{float:right}
.cf{position:absolute;top:30%;width:8px;height:12px;border-radius:2px;pointer-events:none}
.vs{display:flex;gap:8px;align-items:stretch;margin-top:12px}
.vs-col{flex:1;display:flex;flex-direction:column;gap:4px}
.vs-mid{align-self:center;font-weight:900;color:#bbb}
.vs-h{font-size:12px;font-weight:700;color:#fff;border-radius:6px;padding:3px 8px;text-align:center}
.vs-h.ai{background:linear-gradient(90deg,#FF6CAB,#7366FF)}.vs-h.me{background:#1E1E1E}
.vs-r{font-size:12px;padding:3px 8px;border-radius:6px}
.vs-r.no{background:#FFEDE8;color:var(--red)}.vs-r.no::before{content:"× "}
.vs-r.ok{background:#E7F8EE;color:#14AE5C}.vs-r.ok::before{content:"✓ "}

/* 场景细节：咖啡馆窗口用暖色 */
.win.cafe .tb{background:#2E2622}
.win.cafe .tool.on{background:var(--blue)}

/* 小屏 */
@media (max-width:1180px){.left{width:200px}.right{width:224px}.stage{padding:12px}}
@media (max-width:980px){.left{display:none}.brand{display:none}}
@media (max-width:760px){
  .stage{padding:0}.win{border-radius:0}
  .right{width:190px}.tb-btn span,.crumb,.tb-title .sep{display:none}
  .levels{flex-direction:column}.lv-link{flex-basis:12px;width:2px;height:12px;align-self:center;background:repeating-linear-gradient(180deg,#B8C4D4 0 4px,transparent 4px 8px)}
  .map-card{padding:22px}
  .mobile-tip{display:block}
  .tools{display:none}
}
@media (max-width:760px){
  .body{flex-direction:column}
  .canvas{flex:1 1 auto;min-height:40vh}
  .right{width:auto;height:30vh;border-left:0;border-top:1px solid var(--line);order:2}
  .left{display:flex;width:auto;max-height:22vh;border-right:0;border-top:1px solid var(--line);order:3}
  .left .layers,.left>.ptitle:first-child{display:none}
  .stage{padding:0}
}
@media (max-width:560px){.tb-title{font-size:12px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* ---------- 配音 & 打击感 ---------- */
.mute{position:fixed;right:10px;bottom:8px;z-index:60;display:flex;align-items:center;gap:6px;background:rgba(30,30,30,.82);color:#fff;border:0;border-radius:99px;padding:4px 10px 4px 8px;font-size:13px;cursor:pointer;backdrop-filter:blur(6px)}
.mute span{font-size:11px;opacity:.85}
.mute.off{background:rgba(120,120,120,.75)}
.tav{position:relative}
.temo{position:absolute;left:66px;top:-18px;font-size:34px;opacity:0;transform:scale(.3);transition:.25s cubic-bezier(.3,1.7,.5,1);pointer-events:none;filter:drop-shadow(0 3px 4px rgba(0,0,0,.2))}
.temo.on{opacity:1;transform:scale(1) rotate(-8deg);animation:wob 1.4s ease-in-out .3s infinite}
@keyframes wob{0%,100%{transform:scale(1) rotate(-8deg)}50%{transform:scale(1.12) rotate(8deg) translateY(-4px)}}
.say{display:flex;align-items:center;gap:6px}
.say .sface{font-style:normal;font-size:20px;line-height:1;margin:-6px 0 -6px -4px;display:inline-block;animation:wob 1s ease-in-out infinite}
.m-face{font-size:54px;text-align:center;line-height:1;margin:-6px 0 6px;animation:wob 1.2s ease-in-out infinite}
.m-say b em{font-style:italic;font-weight:600;color:#9A8CFF;font-size:12px;margin-left:4px}
.spark{position:absolute;width:7px;height:7px;border-radius:2px;pointer-events:none;z-index:8}
.spark.star{width:10px;height:10px;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%)}
.ring{position:absolute;width:80px;height:80px;border-radius:50%;border:3px solid #FFC700;pointer-events:none;z-index:8}
.combo{position:absolute;top:14px;left:50%;translate:-50% 0;z-index:9;background:linear-gradient(90deg,#9747FF,#F24822);color:#fff;font-weight:800;padding:6px 14px;border-radius:99px;font-size:14px;opacity:0;transition:opacity .25s;pointer-events:none;box-shadow:0 6px 18px rgba(151,71,255,.35)}
.combo b{font-size:18px}
.combo.on{opacity:1}
.hype{position:absolute;z-index:9;display:flex;align-items:center;gap:6px;background:#fff;border:2px solid #1F2329;border-radius:12px 12px 12px 4px;padding:6px 12px 6px 6px;font-weight:800;font-size:14px;color:#1F2329;box-shadow:3px 3px 0 #1F2329;white-space:nowrap;pointer-events:none}
.hype .hav{font-size:20px}
@media (prefers-reduced-motion: reduce){.temo.on,.say .sface,.m-face{animation:none}}

/* =====================================================================
   v3 设计系统：统一色板 / 圆角 4·6·10·12·16 / 阴影 sh-1·2·3 / 缓动
   ===================================================================== */
::selection{background:rgba(37,99,235,.22)}
*{scrollbar-width:thin;scrollbar-color:#D0D3D9 transparent}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#D0D3D9;border-radius:999px;border:2px solid transparent;background-clip:padding-box}::-webkit-scrollbar-track{background:transparent}
:focus{outline:none}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:6px}
button{transition:background-color .18s var(--ease),color .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease),border-color .18s var(--ease)}
button:active:not(:disabled){transform:scale(.97)}
.toast{background:var(--ink);border-radius:10px;box-shadow:var(--sh-2)}

/* 主按钮统一用 --primary；#0D99FF 只给“选中”相关 UI */
.ship,.btn.primary,.choice b{background:var(--primary)}
.ship:hover,.btn.primary:hover{background:var(--primary-d)}
.ship{height:32px;border-radius:10px;box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 4px 12px rgba(37,99,235,.35)}
.btn{height:38px;border-radius:10px;padding:0 18px}
.btn.ghost{background:#F2F3F5;color:var(--ink)}.btn.ghost:hover{background:#E8E9EC}
.lv-n{color:var(--primary)}

/* 展示字体：只用在标题、徽章、连击、夸夸 */
.lv-t,.m-badge,.combo,.hype,.teaser-t,.end h1,.tname,.dtoast,.tw-h b,.ticket-h b,.fund-v b,.m-reward b{font-family:var(--display);letter-spacing:.5px}
.lv-t{font-size:20px;font-weight:400}
.m-badge{font-size:24px;font-weight:400;margin:0;padding:6px 14px;border-radius:12px}
.combo{font-weight:400}.hype{font-weight:400;box-shadow:var(--sh-2)}
.tname{font-size:18px;font-weight:400;color:var(--primary)}

/* ---------- 标题 Logo（一行，Figma 选中框） ---------- */
.title-row{display:flex;flex-direction:row;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.gtitle{display:flex;align-items:center;margin:6px 0 8px;font-family:var(--display);font-weight:400;line-height:1;letter-spacing:1px;font-size:54px;color:var(--ink)}
.gt-a{display:flex}
.gt-a i{font-style:normal;display:inline-block;animation:hop 3.6s var(--ease) infinite;animation-delay:calc(var(--d,0) * 90ms)}
.gt-a i:nth-child(1){--d:0}.gt-a i:nth-child(2){--d:1}.gt-a i:nth-child(3){--d:2}.gt-a i:nth-child(4){--d:3}.gt-a i:nth-child(5){--d:4}.gt-a i:nth-child(6){--d:5}
@keyframes hop{0%,70%,100%{transform:none}76%{transform:translateY(-8px) rotate(-3deg)}84%{transform:translateY(0) scaleY(.92)}90%{transform:none}}
.gsel{position:relative;margin-left:12px;padding:4px 10px 6px;color:var(--primary);background:rgba(37,99,235,.08);box-shadow:inset 0 0 0 2px var(--blue);font-weight:400}
.gsel u{position:absolute;width:10px;height:10px;background:#fff;border:2px solid var(--blue);box-sizing:border-box;border-radius:2px}
.gsel u:nth-of-type(1){left:-5px;top:-5px}.gsel u:nth-of-type(2){right:-5px;top:-5px}.gsel u:nth-of-type(3){left:-5px;bottom:-5px}.gsel u:nth-of-type(4){right:-5px;bottom:-5px}
.gsize{position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);font-family:var(--font);font-size:11px;font-weight:600;letter-spacing:0;color:#fff;background:var(--blue);padding:3px 7px;border-radius:4px;white-space:nowrap}
.gcur{position:absolute;right:-74px;top:58%;display:flex;align-items:flex-start;gap:2px;font-family:var(--font);letter-spacing:0;animation:curf 4s ease-in-out infinite}
.gcur svg{width:18px;height:18px;fill:var(--red);stroke:#fff;stroke-width:1.4;filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}
.gcur em{font-style:normal;font-size:12px;font-weight:700;color:#fff;background:var(--red);padding:3px 8px;border-radius:4px 10px 10px 10px;margin-top:12px}
@keyframes curf{0%,100%{transform:translate(0,0)}50%{transform:translate(-8px,-6px)}}
.gtag{margin:0 0 14px!important;font-size:13px!important;color:var(--ink2);display:flex;align-items:center;gap:8px}
.gtag::before{content:"";width:24px;height:2px;background:var(--line);border-radius:2px}
.map-card{border-radius:16px;box-shadow:var(--sh-3);padding:34px 36px 28px}
.pitch{margin:18px 0 14px;color:var(--ink2)}
.fund{border-radius:12px;background:#F5F8FF;border-color:#DCE6FF}
.bar i{background:linear-gradient(90deg,var(--primary),var(--purple))}

/* 关卡卡片：错落入场 + 悬停弹一下 + 角色待机 */
.levels{gap:0}
.lv{border-radius:12px;padding:14px 14px 12px;box-shadow:var(--sh-1);border-color:transparent;transition:transform .35s var(--spring),box-shadow .25s var(--ease),border-color .2s}
.lv:hover:not(:disabled){transform:translateY(-4px) scale(1.02);box-shadow:var(--sh-2);border-color:var(--blue)}
.lv.night{background:#F7F5FF}.lv.night .lv-n{color:var(--purple)}
.lv.done::after{background:var(--ok);font-family:var(--font);top:12px;right:12px}
.map .lv{animation:cardin .6s var(--spring) backwards}
.map .lv:nth-of-type(1){animation-delay:.05s}.map .lv:nth-of-type(2){animation-delay:.12s}.map .lv:nth-of-type(3){animation-delay:.19s}.map .lv:nth-of-type(4){animation-delay:.26s}.map .lv:nth-of-type(5){animation-delay:.33s}
@keyframes cardin{from{opacity:0;transform:translateY(18px) scale(.94)}}
.map-card{animation:rise .5s var(--spring)}
.lv-f{margin-top:auto;padding-top:10px}
.lv-t{line-height:1.15}
.avh{transform-box:fill-box;transform-origin:50% 90%;animation:avbob 3.4s ease-in-out infinite}
.ave{transform-box:fill-box;transform-origin:50% 50%;animation:blinkeye 4.6s infinite}
.lv:nth-of-type(2) .avh,.tav .avh{animation-delay:-1.1s}.lv:nth-of-type(3) .avh{animation-delay:-2.2s}.lv:nth-of-type(4) .avh{animation-delay:-.6s}
@keyframes avbob{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-1.5px) rotate(-2deg)}60%{transform:translateY(.5px) rotate(2deg)}}
@keyframes blinkeye{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
.tbox .tav svg{animation:talkbob .5s ease-in-out infinite alternate}
@keyframes talkbob{to{transform:translateY(-2px) scale(1.02)}}
.tbox{border-radius:16px;box-shadow:var(--sh-3);animation:tboxin .45s var(--spring)}
@keyframes tboxin{from{opacity:0;transform:translateY(24px) scale(.96)}}
.choice{border-radius:10px;transition:transform .3s var(--spring),background-color .2s,border-color .2s}
.choice b{border-radius:6px}

/* ---------- 编辑器：面板与工具栏精修 ---------- */
.win{border-radius:16px;box-shadow:var(--sh-3);animation:winin .5s var(--spring)}
@keyframes winin{from{opacity:0;transform:translateY(20px) scale(.97)}}
.tb{height:48px;background:linear-gradient(#262A30,#1F2329);padding:0 10px;gap:8px;border-bottom:1px solid #111}
.win.cafe .tb{background:linear-gradient(#352B26,#2B231F)}
.win.night .tb{background:linear-gradient(#2C2545,#221C38)}
.brand{font-weight:400;font-family:var(--display);font-size:15px;letter-spacing:.5px;border-right-color:rgba(255,255,255,.12)}
.logo{background:var(--primary);border-radius:6px}
.tool,.tb-btn{border-radius:10px;color:#D5D8DE}
.tb-btn:hover,.tool:hover:not(:disabled):not(.on){background:rgba(255,255,255,.09)}
.tool.on{background:var(--blue);box-shadow:0 2px 8px rgba(37,99,235,.45)}
.tb-btn svg,.tool svg{width:18px;height:18px;stroke-width:1.6}
.tb-title{color:rgba(255,255,255,.55)}.tb-title .sep{color:rgba(255,255,255,.25)}
.crumb{background:rgba(255,255,255,.08);padding:3px 8px;border-radius:999px;font-size:11px}
.left,.right{background:#FBFBFC}
.left{width:248px}.right{width:256px}
.ptitle{font-size:11px;font-weight:700;letter-spacing:.6px;color:var(--ink2);padding:14px 16px 8px;text-transform:uppercase}
.layers{padding:0 8px 8px}
.ly{height:30px;border-radius:6px;padding-right:8px;margin:1px 0;color:#2B2F36;transition:background-color .15s}
.ly[data-id]:hover,.ly.hov{box-shadow:none;background:#F0F2F5}
.ly.on{background:#E1F1FF;color:#0A5FA3;font-weight:600}
.ly.on i{color:var(--blue)}
.ly em{background:#EEF0F3;color:var(--ink2);border-radius:4px;padding:1px 5px}
.ly.on em{background:#fff}
.brief{background:#fff;border-top:1px solid var(--line);padding:14px 16px 16px}
.bn{font-size:14px}
.concept{color:var(--purple)}
.quote{border-radius:12px;background:#F7F8FA;border-color:transparent;font-size:13px;color:#2B2F36}
.quote::before{background:#F7F8FA;border-color:transparent}
.quote .qadd{display:block;margin-top:6px;font-style:normal;font-weight:700;color:var(--red);animation:pop .5s var(--spring)}
.sec{padding:12px 14px 14px;border-bottom-color:#EEF0F3}
.sh{font-size:11px;letter-spacing:.4px;color:var(--ink2)}
.nf{height:30px;border-radius:6px;background:#F2F3F5}
.nf:hover{border-color:#E1E3E8}
.seg{border-radius:10px;background:#F2F3F5;padding:3px}
.seg button{border-radius:6px;height:26px}
.seg button.on{box-shadow:var(--sh-1)}
.sw{gap:6px}
.sw button{border-radius:6px;transition:transform .25s var(--spring)}
.sw button:hover{transform:scale(1.15)}
.hexrow{border-radius:6px;background:#F2F3F5}
.add-al{border-radius:10px}
.canvas{background-color:#ECEDF0;background-image:radial-gradient(circle,#CDD0D6 1px,transparent 1.2px)}
.artboard{box-shadow:var(--sh-2)}
.ab-label{color:var(--ink2);font-weight:500}
.ov-size,.ov-pill,.ms i{border-radius:4px;font-weight:600}
.zoomtag{border-radius:6px;box-shadow:var(--sh-1);border:0}
.coach{border-radius:12px;box-shadow:var(--sh-3);background:var(--ink)}
.h-rs{border-radius:2px;width:10px;height:10px;margin:-5px 0 0 -5px}
.ov-sel{box-shadow:0 0 0 .5px rgba(37,99,235,.4)}
/* 被编辑的元素：弹簧回弹 */
.node.boing{animation:boing .5s var(--spring)}
@keyframes boing{0%{scale:1}30%{scale:1.06}60%{scale:.98}100%{scale:1}}

/* ---------- 手机外框 ---------- */
.abwrap.phone .artboard{border-radius:40px;overflow:hidden;box-shadow:0 0 0 9px #1F2329,0 0 0 10px #444A54,0 28px 60px rgba(31,35,41,.35)}
.abwrap.phone .ab-label{top:-34px}
.sbar{position:absolute;left:0;right:0;top:0;height:40px;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:6px 26px 0 30px;pointer-events:none;color:#fff;mix-blend-mode:difference;font-size:14px}
.sbar b{font-weight:700;font-family:var(--font)}
.sbar span{display:flex;gap:5px;align-items:center}.sbar svg{height:11px;fill:currentColor}.sbar svg:first-child{width:17px}.sbar svg:last-child{width:25px}
.sbar .island{position:absolute;left:50%;top:9px;width:96px;height:26px;margin-left:-48px;background:#000;border-radius:999px;mix-blend-mode:normal}
.homebar{position:absolute;left:50%;bottom:8px;width:120px;height:5px;margin-left:-60px;border-radius:999px;background:#fff;mix-blend-mode:difference;z-index:4;pointer-events:none}

/* ---------- 需求工单：进度 + 盖章 ---------- */
.ticket-h{display:flex;align-items:center;gap:8px;padding:14px 0 8px}
.ticket-h .ptitle{padding:0}
.ticket-h b{font-size:16px;font-weight:400;color:var(--ink2);display:inline-block;font-variant-numeric:tabular-nums}
.ticket-h .pg{flex:1;height:6px;background:#EEF0F3;border-radius:999px;overflow:hidden}
.ticket-h .pg i{display:block;height:100%;width:0;background:var(--ok);border-radius:999px;transition:width .5s var(--spring)}
.ticket-h.all b{color:var(--ok)}
.ticket-h.all .pg i{background:linear-gradient(90deg,#14AE5C,#5BD38A)}
.rules{gap:6px}
.rules li{position:relative;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:#F7F8FA;color:#2B2F36;font-size:12.5px;line-height:1.45;transition:background-color .3s var(--ease),color .3s var(--ease)}
.rules li span{position:relative;transition:color .3s}
.rules li span::after{content:"";position:absolute;left:0;top:52%;height:1.5px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease);opacity:.55}
.rules li i.ck{width:22px;height:22px;flex:none;border:0;margin:0;background:none;display:block}
.rules li i.ck::after{display:none}
.ck svg{width:22px;height:22px;display:block;overflow:visible}
.ck circle{fill:#fff;stroke:#C9CDD4;stroke-width:1.6;transition:fill .25s,stroke .25s}
.ck path{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16;stroke-dashoffset:16;transition:stroke-dashoffset .3s var(--ease) .08s}
.rules li.ok{background:#E8F8EF;color:#0E7A41}
.rules li.ok span::after{transform:scaleX(1)}
.rules li.ok .ck circle{fill:var(--ok);stroke:var(--ok)}
.rules li.ok .ck path{stroke-dashoffset:0}
.rules li.pop{animation:tkpop .55s var(--spring)}
.rules li.pop .ck svg{animation:stamp .55s var(--spring)}
.rules li.pop::before{content:"";position:absolute;left:8px;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;border:2px solid var(--ok);animation:stampring .6s var(--ease) forwards;pointer-events:none}
@keyframes stamp{0%{transform:scale(2.4) rotate(-20deg);opacity:0}55%{transform:scale(.85) rotate(4deg);opacity:1}100%{transform:none}}
@keyframes stampring{from{transform:scale(.6);opacity:1}to{transform:scale(2.2);opacity:0}}
@keyframes tkpop{0%{transform:none}30%{transform:scale(1.04)}100%{transform:none}}
.rules li.lost{animation:tkshake .45s ease-in-out;background:#FFF1EE;color:#B2321A}
.rules li.lost .ck svg{animation:popoff .45s var(--ease)}
@keyframes tkshake{0%,100%{transform:none}20%{transform:translateX(-5px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
@keyframes popoff{0%{transform:scale(1.25)}100%{transform:none}}
.rules li[data-r="btns"]{box-shadow:inset 0 0 0 1.5px rgba(242,72,34,.35)}
.rules li[data-r="btns"].ok{box-shadow:none}

/* 完成提示（画布上，靠近编辑的元素） */
.dtoast{position:absolute;z-index:10;transform:translate(-50%,-10px);white-space:nowrap;pointer-events:none;font-size:16px;padding:6px 14px;border-radius:999px;color:#fff;box-shadow:var(--sh-2)}
.dtoast.good{background:var(--ok)}.dtoast.bad{background:var(--red);font-size:14px}

/* 甲方改需求 */
.canvas>.twist{position:absolute;z-index:11;top:18px;left:50%;transform:translateX(-50%);display:flex;gap:12px;align-items:flex-start;width:min(440px,92%);background:#fff;border-radius:16px;padding:14px 16px;box-shadow:var(--sh-3),0 0 0 2px var(--red)}
.canvas>.twist .tw-av svg{border-radius:50%;display:block;animation:talkbob .4s ease-in-out infinite alternate}
.tw-b{flex:1;min-width:0}
.tw-h{display:flex;align-items:center;gap:8px}.tw-h b{font-size:17px;font-weight:400}.tw-h span{font-size:11px;font-weight:700;color:#fff;background:var(--red);border-radius:999px;padding:2px 8px}
.canvas>.twist p{margin:6px 0 10px;font-size:14px;line-height:1.55;min-height:44px}
.tw-ok{float:right;height:30px;border:0;border-radius:10px;background:#F2F3F5;padding:0 14px;font-size:13px;font-weight:600}
.tw-ok:hover{background:#E8E9EC}

/* 弹窗：表情和徽章同一行 */
.m-card{border-radius:16px;box-shadow:var(--sh-3);animation:rise .45s var(--spring)}
.m-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.m-head .m-face{font-size:44px;margin:0}
.m-say{border-radius:12px;background:#F7F8FA}
.m-rules li i{width:18px;height:18px}
.m-reward b{color:var(--ok);font-weight:400;font-size:22px}

@media (max-width:1180px){.left{width:216px}.right{width:232px}.gtitle{font-size:46px}}
@media (max-width:760px){.gtitle{font-size:34px}.gcur{display:none}.title-row{align-items:flex-start;flex-direction:column}.lv-t{font-size:18px}}
@media (prefers-reduced-motion:reduce){.gt-a i,.gcur,.avh,.ave,.tbox .tav svg,.twist .tw-av svg{animation:none}}
@media (max-width:760px){.right,.left{width:auto!important;flex:none}}

/* ================= 第二轮：游戏感外框 ================= */
.stage{flex-direction:column;gap:10px;padding:12px 20px 16px}
.stage>.win{min-height:0}
/* 顶部 HUD */
.hud{flex:none;height:62px;display:flex;align-items:center;gap:12px;position:relative;z-index:8}
.hud>div{background:#fff;border-radius:16px;box-shadow:0 0 0 2px var(--ink),0 4px 0 var(--ink);height:52px;display:flex;align-items:center}
.hud-me{padding:0 14px 0 6px;gap:10px;position:relative}
.hud-por svg{display:block;border-radius:50%;box-shadow:0 0 0 2px var(--ink)}
.hud-id b{display:block;font-family:var(--display);font-weight:400;font-size:20px;line-height:1}
.hud-id span{font-size:12px;color:var(--ink2)}
.hud-say{position:absolute;left:58px;top:58px;background:#fff!important;height:auto!important;padding:8px 14px;border-radius:4px 14px 14px 14px!important;font-family:var(--display);font-size:20px;white-space:nowrap;opacity:0;transform:scale(.6);transform-origin:0 0;transition:opacity .2s,transform .2s;pointer-events:none;gap:6px;z-index:20}
.hud-say.on{opacity:1;transform:none}
.hud-say span{font-size:22px}
.hud-lv{padding:0 18px;gap:10px;flex:1;min-width:0}
.hud-lv span{font-size:12px;font-weight:700;background:var(--ink);color:#FFD43B;border-radius:8px;padding:3px 8px;flex:none}
.hud-lv b{font-family:var(--display);font-weight:400;font-size:26px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hud-fund{padding:0 16px 0 10px;gap:10px;width:300px}
.hud-fv{flex:1}
.hud-fv>div:first-child{display:flex;align-items:baseline;gap:6px;font-size:12px}
.hud-fv em{font-style:normal;color:var(--ink2)}
.hud-fv b{font-family:var(--display);font-weight:400;font-size:20px;color:var(--ink)}
.hud-fv i{font-style:normal;color:var(--ink2)}
.hud-fv .bar{height:8px;background:#EEF0F3;border-radius:99px;overflow:hidden;margin-top:4px;box-shadow:inset 0 0 0 1.5px var(--ink)}
.hud-fv .bar i{display:block;height:100%;background:linear-gradient(90deg,#FFC53D,#FF8A00);border-radius:99px}
.hud-ico svg{display:block}
.hud-combo{padding:0 16px;gap:8px;min-width:110px;justify-content:center;transition:background .2s,transform .2s}
.hud-combo em{font-style:normal;font-size:12px;color:var(--ink2);font-weight:700}
.hud-combo b{font-family:var(--display);font-weight:400;font-size:28px;display:inline-block;color:#C9CDD4}
.hud-combo.on{background:linear-gradient(90deg,#9747FF,#F24822)!important}
.hud-combo.on em,.hud-combo.on b{color:#fff}
.hud-combo.hot b::after{content:" 🔥"}
/* 窗口更“厚” */
.win{box-shadow:0 0 0 2px var(--ink),0 6px 0 var(--ink),0 30px 60px rgba(20,30,50,.25)!important;border-radius:18px}
.right{width:256px!important;display:flex;flex-direction:column}
.right .layers{flex:none;max-height:196px;overflow:auto;border-bottom:1px solid var(--line)}
.right .insp{flex:1;overflow:auto}
/* 左侧订单栏：甲方 + 需求单 */
.order{flex:none;width:300px;background:#F4F1EA;border-right:1px solid var(--line);overflow:auto;padding:14px 14px 18px;display:flex;flex-direction:column;gap:14px;
  background-image:radial-gradient(rgba(31,35,41,.07) 1px,transparent 1px);background-size:14px 14px}
.client{position:relative}
.cl-top{display:flex;gap:12px;align-items:center}
.cl-por{position:relative;flex:none}
.cl-av{border-radius:50%;box-shadow:0 0 0 3px #fff,0 0 0 5px var(--ink),0 6px 0 2px var(--ink);display:block}
.cl-av svg{display:block;border-radius:50%}
.cl-mood{position:absolute;right:-8px;bottom:-4px;font-size:28px;line-height:1;filter:drop-shadow(0 2px 0 rgba(0,0,0,.15))}
.cl-id b{display:block;font-family:var(--display);font-weight:400;font-size:28px;line-height:1.05}
.cl-id span{display:block;font-size:13px;color:var(--ink2);margin-top:2px}
.cl-id em{display:inline-block;font-style:normal;font-size:11px;font-weight:700;margin-top:6px;background:var(--ink);color:#fff;padding:2px 8px;border-radius:99px}
.bubble{position:relative;margin-top:14px;background:#fff;border-radius:16px;padding:12px 14px;box-shadow:0 0 0 2px var(--ink),0 4px 0 var(--ink);min-height:64px}
.bubble::before{content:"";position:absolute;left:34px;top:-11px;width:18px;height:18px;background:#fff;border-left:2px solid var(--ink);border-top:2px solid var(--ink);transform:rotate(45deg);border-radius:3px 0 0 0}
.bubble .quote{margin:0;font-size:15.5px;line-height:1.6;color:var(--ink);min-height:25px;font-style:normal}
.bubble .qadd{display:block;font-style:normal;margin-top:6px;font-size:13px;color:#B2321A;font-weight:600}
.b-who:empty{display:none}
.b-who{margin-bottom:6px}
.tw-badge{display:inline-block;font-family:var(--display);font-size:18px;color:#fff;background:var(--red);padding:2px 10px;border-radius:8px;transform:rotate(-3deg)}
.tw-ok{margin-top:10px;border:0;background:var(--ink);color:#fff;font-size:14px;font-weight:700;padding:8px 16px;border-radius:10px;box-shadow:0 3px 0 #000}
.tw-ok:active{transform:translateY(2px);box-shadow:0 1px 0 #000}
.client.twist .bubble{background:#FFF1EE;box-shadow:0 0 0 2px var(--red),0 4px 0 var(--red)}
.client.twist .bubble::before{background:#FFF1EE;border-color:var(--red)}
.client.twist .cl-av{animation:talkbob .35s ease-in-out infinite alternate}
.client.sim-mode .bubble{background:#EEF6FF}
.client.sim-mode .bubble::before{background:#EEF6FF}
.client.sim-mode .sim-bar{position:static;transform:none;display:inline-flex;align-items:center;gap:6px;box-shadow:none;background:var(--ink);color:#fff;font-size:12px;padding:3px 10px;border-radius:99px}
.client[data-mood="happy"] .bubble{background:#E8F8EF}.client[data-mood="happy"] .bubble::before{background:#E8F8EF}
.client[data-mood="sad"] .bubble{background:#FFF1EE}.client[data-mood="sad"] .bubble::before{background:#FFF1EE}
/* 需求单：便利贴 */
.ticket{position:relative;background:#FFF6B8;border-radius:4px 4px 14px 4px;padding:16px 14px 14px;box-shadow:0 0 0 2px var(--ink),0 5px 0 var(--ink);transform:rotate(-1deg);transition:background .3s}
.tk-tape{position:absolute;left:50%;top:-11px;width:86px;height:22px;margin-left:-43px;background:rgba(151,71,255,.35);transform:rotate(2deg);border-radius:2px}
.ticket .ticket-h{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;padding:0 2px 8px}
.tk-t span{display:block;font-family:var(--display);font-size:30px;line-height:1}
.tk-t small{display:block;font-size:11.5px;color:#7A6A1F;margin-top:4px;font-weight:600}
.ticket .ticket-h b{font-family:var(--display);font-size:34px;line-height:1;color:var(--ink)}
.ticket .pg,.ticket .tk-pg{height:10px;background:rgba(31,35,41,.1);border-radius:99px;overflow:hidden;margin:0 2px 12px;box-shadow:inset 0 0 0 1.5px var(--ink)}
.ticket .pg i,.ticket .tk-pg i{display:block;height:100%;width:0;background:var(--ok);border-radius:99px;transition:width .5s var(--spring)}
.ticket .rules{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ticket .rules li{display:flex;background:rgba(255,255,255,.72);font-size:14.5px;line-height:1.45;padding:10px 10px;border-radius:10px;font-weight:500}
.ticket .rules li.ok{background:rgba(232,248,239,.95)}
.ticket .ck svg,.ticket .rules li i.ck{width:26px;height:26px}
.ticket .rules li.pop::before{left:10px;width:30px;height:30px;margin-top:-15px}
.tk-stamp{position:absolute;right:10px;bottom:10px;font-family:var(--display);font-size:30px;color:var(--ok);border:3px solid var(--ok);border-radius:10px;padding:2px 10px;transform:rotate(-14deg) scale(2.4);opacity:0;pointer-events:none;transition:transform .4s var(--spring),opacity .25s;background:rgba(255,255,255,.6)}
.ticket.all{background:#E3F7E9}
.ticket.all .tk-stamp{opacity:1;transform:rotate(-14deg) scale(1)}
.ticket.all .ticket-h b{color:var(--ok)}
/* 教学小提示：贴在画板旁边 */
.coach{bottom:auto!important;transform:none!important;max-width:none!important;width:220px;padding:12px 14px 12px!important;font-size:14px;border-radius:14px!important;box-shadow:0 0 0 2px #000,0 4px 0 #000!important;transition:left .3s var(--ease),top .3s var(--ease)}
.coach::before{content:"";position:absolute;width:14px;height:14px;background:var(--ink);transform:rotate(45deg);border-radius:2px}
.coach[data-dir="l"]::before{left:-7px;top:calc(var(--ay,40px) - 7px)}
.coach[data-dir="r"]::before{right:-7px;top:calc(var(--ay,40px) - 7px)}
.coach[data-dir="u"]::before{right:30px;top:-7px}
.coach .c-txt{font-size:14.5px}
/* 不再在画布上弹出的东西 */
.canvas>.twist,.canvas>.combo,.canvas>.hype{display:none!important}
.dtoast{transform:translate(-50%,-50%);font-family:var(--display);font-size:19px;padding:6px 16px;box-shadow:0 0 0 2px rgba(0,0,0,.85),0 3px 0 rgba(0,0,0,.85)}
.win.simming .order{opacity:1!important;pointer-events:none}
/* 关卡开场卡 */
.lstart{position:absolute;inset:0;z-index:30;display:grid;place-items:center;background:rgba(20,22,30,.45);backdrop-filter:blur(3px);transition:opacity .28s}
.lstart.out{opacity:0;pointer-events:none}
.ls-card{width:420px;background:#fff;border-radius:22px;padding:22px 26px 24px;text-align:center;box-shadow:0 0 0 3px var(--ink),0 8px 0 var(--ink),0 30px 60px rgba(0,0,0,.3);position:relative}
.ls-k{display:flex;justify-content:space-between;align-items:center;font-family:var(--display);font-size:22px}
.ls-k span{font-family:var(--font);font-size:12px;font-weight:700;background:var(--ink);color:#FFD43B;border-radius:8px;padding:3px 8px}
.ls-por{margin:10px auto 6px;width:120px}
.ls-por svg{display:block;border-radius:50%;box-shadow:0 0 0 4px #fff,0 0 0 7px var(--ink)}
.ls-t{font-family:var(--display);font-size:44px;line-height:1.1;margin-top:10px}
.ls-c{font-size:14px;color:var(--ink2);margin-top:4px}
.ls-meta{display:flex;gap:8px;margin:16px 0 12px}
.ls-meta>div{flex:1;background:#F4F1EA;border-radius:12px;padding:8px 4px;box-shadow:inset 0 0 0 1.5px rgba(31,35,41,.12)}
.ls-meta b{display:block;font-family:var(--display);font-weight:400;font-size:21px}
.ls-meta span{font-size:11.5px;color:var(--ink2)}
.ls-warn{font-size:13px;font-weight:700;color:#B2321A;background:#FFF1EE;border-radius:10px;padding:6px;margin-bottom:12px}
.ls-go,.start-go{border:0;font-family:var(--display);color:#fff;background:linear-gradient(#3B82F6,#2563EB);box-shadow:0 0 0 3px var(--ink),0 7px 0 var(--ink);border-radius:16px;cursor:pointer;transition:transform .12s,box-shadow .12s}
.ls-go{width:100%;font-size:30px;padding:10px}
.ls-go:hover,.start-go:hover{transform:translateY(-2px);box-shadow:0 0 0 3px var(--ink),0 9px 0 var(--ink)}
.ls-go:active,.start-go:active,.start-go.pressed{transform:translateY(6px);box-shadow:0 0 0 3px var(--ink),0 1px 0 var(--ink)}
/* 开始页 */
.start{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:40px;padding:30px 48px;overflow:hidden;transition:opacity .4s,transform .4s}
.start.leaving{opacity:0;transform:scale(1.04)}
.st-main{position:relative;z-index:2;max-width:640px}
.st-kicker{display:inline-block;font-weight:700;font-size:14px;background:var(--ink);color:#FFD43B;padding:5px 12px;border-radius:99px;transform:rotate(-2deg)}
.gtitle.huge{font-size:96px;margin:22px 0 34px;flex-wrap:wrap;row-gap:8px;text-shadow:0 4px 0 rgba(255,255,255,.9)}
.gtitle.huge .gsel{margin-left:16px;padding:6px 16px 10px;background:rgba(37,99,235,.12)}
.gtitle.huge .gsize{font-size:13px;top:calc(100% + 10px)}
.gtitle.huge .gcur{right:-96px}
.gtitle .gsize,.gtitle .gcur,.gtitle .gcur em{text-shadow:none}
.st-sub{font-size:18px;color:var(--ink2);margin:0 0 22px;line-height:1.6}
.st-crew{display:flex;align-items:flex-end;gap:10px;margin-bottom:26px}
.st-c{display:flex;flex-direction:column;align-items:center;gap:6px;animation:crew 2.8s ease-in-out infinite;animation-delay:var(--d)}
.st-c svg{display:block;border-radius:50%;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--ink)}
.st-c span{font-size:12px;font-weight:700;background:#fff;padding:1px 8px;border-radius:99px;box-shadow:0 0 0 1.5px var(--ink)}
.st-c.me{margin-left:14px;animation-delay:.5s}
.st-c.me svg{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--primary)}
.st-c.me span{background:var(--primary);color:#fff;box-shadow:none}
@keyframes crew{0%,100%{transform:none}50%{transform:translateY(-6px)}}
.start-go{display:inline-flex;align-items:center;gap:16px;font-size:44px;padding:14px 40px 16px}
.start-go em{font-style:normal;font-size:26px;background:#FFD43B;color:var(--ink);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 2.5px var(--ink)}
.start-go:not(.pressed) em{animation:gopulse 1.2s ease-in-out infinite}
@keyframes gopulse{50%{transform:scale(1.15) rotate(-6deg)}}
.st-note{margin-top:20px;font-size:13px;color:var(--ink2)}
.st-art{position:relative;z-index:1;flex:none}
.st-board{position:relative;width:330px;height:430px;background:#fff;border-radius:22px;box-shadow:0 0 0 3px var(--ink),0 8px 0 var(--ink),0 30px 60px rgba(0,0,0,.18);transform:rotate(-4deg);display:grid;place-items:center;background-image:radial-gradient(rgba(31,35,41,.12) 1px,transparent 1px);background-size:16px 16px}
.st-frame{position:relative;width:230px;padding:60px 0;display:grid;place-items:center;box-shadow:inset 0 0 0 2px var(--blue);background:rgba(37,99,235,.05)}
.st-fl{position:absolute;left:0;top:-22px;font-size:12px;color:var(--blue);font-weight:700}
.st-btn{font-family:var(--display);font-size:26px;color:#fff;background:var(--primary);padding:14px 30px;border-radius:14px;animation:stbtn 3s var(--ease) infinite}
@keyframes stbtn{0%,100%{border-radius:4px;transform:none}40%,70%{border-radius:18px;transform:scale(1.08)}}
.st-h{position:absolute;width:10px;height:10px;background:#fff;border:2px solid var(--blue);border-radius:2px}
.st-h.a{left:-5px;top:-5px}.st-h.b{right:-5px;top:-5px}.st-h.c{left:-5px;bottom:-5px}.st-h.d{right:-5px;bottom:-5px}
.st-sticky{position:absolute;font-family:var(--display);font-size:20px;line-height:1.2;padding:12px 14px;background:#FFF6B8;box-shadow:0 0 0 2px var(--ink),0 4px 0 var(--ink);border-radius:4px 4px 12px 4px}
.st-sticky.s1{left:-60px;top:28px;transform:rotate(-8deg)}
.st-sticky.s2{right:-56px;top:150px;transform:rotate(7deg);background:#FFD9E6}
.st-sticky.s3{left:-40px;bottom:24px;transform:rotate(5deg);background:#1F2329;color:#FFD43B}
.title-row .home{margin-left:auto}
/* 结算页 */
.rs-wrap .m-card{width:min(520px,100%);padding:26px 26px 22px;border-radius:22px;box-shadow:0 0 0 3px var(--ink),0 8px 0 var(--ink),0 30px 60px rgba(0,0,0,.3);max-height:calc(100vh - 32px);overflow:auto}
.rs{position:relative}
.rs-stamp{position:absolute;right:-6px;top:-8px;font-family:var(--display);font-size:34px;padding:4px 14px;border:4px solid;border-radius:12px;transform:rotate(12deg);animation:rsstamp .55s var(--spring) .15s backwards;background:rgba(255,255,255,.7);z-index:2}
.rs-stamp.ok{color:var(--ok)}.rs-stamp.no{color:var(--red)}
@keyframes rsstamp{0%{transform:rotate(12deg) scale(3);opacity:0}100%{transform:rotate(12deg) scale(1);opacity:1}}
.rs-k{font-family:var(--display);font-size:24px;padding-right:140px}
.rs-head{display:flex;gap:14px;align-items:center;margin:8px 0 12px}
.rs-por{position:relative;flex:none}
.rs-por svg{display:block;border-radius:50%;box-shadow:0 0 0 3px #fff,0 0 0 5px var(--ink)}
.rs-mood{position:absolute;right:-8px;bottom:-4px;font-size:30px}
.rs-bub{flex:1;background:#F4F1EA;border-radius:14px;padding:10px 14px;position:relative}
.rs-bub b{font-family:var(--display);font-weight:400;font-size:20px}
.rs-bub b em{font-style:normal;font-size:13px;color:var(--purple);margin-left:4px;font-family:var(--font)}
.rs-bub p{margin:4px 0 0;font-size:15px;line-height:1.55;min-height:24px}
.m-fail .rs-head{margin-top:34px}
.rs-sec{font-weight:700;font-size:13px;margin:6px 0 6px;display:flex;justify-content:space-between}
.rs-tip{background:#FFF6B8;border-radius:12px;padding:10px 14px;font-size:14px;line-height:1.6;box-shadow:inset 0 0 0 1.5px rgba(31,35,41,.15);margin:12px 0}
.rs-tip b{display:block;font-family:var(--display);font-weight:400;font-size:18px;margin-bottom:2px}
.rs-pay{display:flex;flex-direction:column;gap:8px}
.rs .m-btns .btn{font-size:16px;padding:10px 20px;border-radius:12px}
.rs .m-btns .btn.primary{box-shadow:0 0 0 2px var(--ink),0 4px 0 var(--ink);font-family:var(--display);font-size:22px;padding:8px 26px}
.m-hint-n{font-size:12px;color:var(--ink2)}
.client .tw-ok{float:none;height:auto;display:block}
.gtitle.huge{margin-bottom:52px}
.rs-pay .m-reward{margin:0}
@media (max-width:1180px){.order{width:270px}.hud-fund{width:240px}.gtitle.huge{font-size:72px}.st-art{display:none}}
@media (max-width:980px){.order{width:240px}.hud>.hud-fund{display:none}}
@media (max-width:760px){
  .stage{padding:8px}.hud{height:auto}.hud>.hud-lv,.hud>.hud-combo,.hud>.hud-fund{display:none}.hud>.hud-me{flex:1}
  .order{width:auto!important;flex:none;max-height:none;order:3}
  .right{width:auto!important}
  .gtitle.huge{font-size:44px}.start{padding:20px}.start-go{font-size:32px}.st-crew svg{width:40px;height:40px}
}

.dtoast.gone{opacity:0!important;transition:opacity .15s}
.quote.sayq.sad .stxt{color:#C4301B}.quote.sayq.happy .stxt{color:#0B7D41}.quote.sayq .stxt{font-weight:600}
@media (max-height:860px) and (min-width:761px){.ticket{padding:12px 12px 12px}.ticket .rules{gap:6px}.ticket .rules li{padding:7px 9px;font-size:14px;line-height:1.4}.ticket .pg,.ticket .tk-pg{margin-bottom:9px}.bubble .quote{font-size:14.5px}}

/* 选关：只写 教学 / 1234 + 一句剧情 */
.map .lv{gap:8px;padding:16px 16px 14px;min-height:178px}
.map .lv-n{font-family:var(--display);font-size:46px;line-height:1;font-weight:400;letter-spacing:1px}
.map .lv-story{font-size:14px;line-height:1.55;color:var(--ink);font-weight:500}
.map .lv-f{gap:8px}.map .lv-f em{font-size:14px}
.map .title-row{justify-content:space-between}
.ticket.all{padding-bottom:62px}.ticket .tk-stamp{right:50%;margin-right:-74px;bottom:12px}.ticket.all .rules li{opacity:.85}

/* 声音：只有图标 */
.mute{width:40px;height:40px;padding:0;justify-content:center;border-radius:12px;background:#fff;color:var(--ink);box-shadow:0 0 0 2px var(--ink),0 3px 0 var(--ink);right:14px;bottom:14px;backdrop-filter:none;transition:transform .12s,box-shadow .12s}
.mute:hover{transform:translateY(-1px);box-shadow:0 0 0 2px var(--ink),0 4px 0 var(--ink)}
.mute:active{transform:translateY(2px);box-shadow:0 0 0 2px var(--ink),0 1px 0 var(--ink)}
.mute.off{background:#F2F3F5;color:var(--ink2)}
.mute svg{display:block}

/* 开始接单：被选中的主按钮（和标题里的选中框同一语言） */
.start .start-go{position:relative;display:inline-flex;align-items:center;gap:14px;font-size:38px;letter-spacing:2px;padding:18px 34px 18px 40px;border-radius:14px;
  background:var(--ink);color:#fff;box-shadow:0 5px 0 #000,0 18px 34px -10px rgba(31,35,41,.45);transition:transform .14s var(--ease),box-shadow .14s var(--ease),background .2s}
.start .start-go::before{content:"";position:absolute;inset:-10px;border:1.5px solid var(--blue);border-radius:4px;pointer-events:none;transition:inset .2s var(--ease)}
.start .start-go .hd{position:absolute;width:9px;height:9px;background:#fff;border:1.5px solid var(--blue);border-radius:1px;pointer-events:none;transition:all .2s var(--ease)}
.start .start-go .tl{left:-14px;top:-14px}.start .start-go .tr{right:-14px;top:-14px}.start .start-go .bl{left:-14px;bottom:-14px}.start .start-go .br{right:-14px;bottom:-14px}
.start .start-go .go-ar{transition:transform .2s var(--ease);margin-top:2px}
.start .start-go:hover{transform:translateY(-2px);background:#2A2F36;box-shadow:0 7px 0 #000,0 22px 40px -12px rgba(31,35,41,.5)}
.start .start-go:hover::before{inset:-13px}
.start .start-go:hover .tl{left:-17px;top:-17px}.start .start-go:hover .tr{right:-17px;top:-17px}.start .start-go:hover .bl{left:-17px;bottom:-17px}.start .start-go:hover .br{right:-17px;bottom:-17px}
.start .start-go:hover .go-ar{transform:translateX(5px)}
.start .start-go:active,.start .start-go.pressed{transform:translateY(4px);box-shadow:0 1px 0 #000,0 8px 18px -8px rgba(31,35,41,.4)}
.start .start-go:focus-visible{outline:none}.start .start-go:focus-visible::before{border-width:2.5px}
.start .start-go em{display:none}
@media (max-width:760px){.start .start-go{font-size:30px;padding:14px 26px 14px 30px}}
@media (prefers-reduced-motion: reduce){.start .start-go,.start .start-go *,.start .start-go::before{transition:none}}
.adbg{position:fixed;left:12px;bottom:12px;z-index:9999;background:#1F2329;color:#fff;border-radius:10px;padding:10px 12px;font:12px/1.5 ui-monospace,Menlo,monospace;box-shadow:0 8px 24px rgba(0,0,0,.3);min-width:220px}
.adbg b{font-family:var(--display);font-size:14px}
.adbg pre{margin:6px 0;white-space:pre-wrap;font:inherit}
.adbg button{background:#0D99FF;color:#fff;border:0;border-radius:6px;padding:5px 10px;font:600 12px system-ui;cursor:pointer}

/* ===== 钢笔工具 ===== */
.pen-bg{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(31,35,41,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(31,35,41,.07) 1px,transparent 1px);background-size:20px 20px}
.pen-bg svg{position:absolute;inset:0;overflow:visible}
.pb-safe{fill:none;stroke:#9747FF;stroke-opacity:.35;stroke-width:2;stroke-dasharray:8 6}
.pb-mid{stroke:#F24822;stroke-opacity:.35;stroke-width:2;stroke-dasharray:4 6}
.pb-sk{fill:rgba(255,176,32,.08);stroke:#C9A27A;stroke-width:10;stroke-opacity:.35;stroke-linejoin:round}
.pb-dot{fill:#fff;stroke:#B98352;stroke-width:3}
.pb-dot.first{fill:#FFB020;stroke:#B26A00}
.node.path{pointer-events:none}
.node.path svg{display:block;overflow:visible}
.node.icon svg{display:block;width:100%;height:100%;overflow:visible}
.pen-ov{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.po-rb{fill:none;stroke:var(--blue);stroke-width:1.5;stroke-dasharray:5 4}
.po-hl{stroke:var(--blue);stroke-width:1}
.po-hd{fill:#fff;stroke:var(--blue);stroke-width:1.5}
.po-pt{fill:#fff;stroke:var(--blue);stroke-width:1.5}
.po-pt.on{fill:var(--blue)}
.po-close{fill:none;stroke:#FFB020;stroke-width:3}
.po-cur{fill:var(--blue);opacity:.5}
.pen-tag{position:absolute;transform:translate(10px,10px);background:var(--blue);color:#fff;font-size:11px;font-weight:600;padding:2px 6px;border-radius:4px;white-space:nowrap;pointer-events:none;font-variant-numeric:tabular-nums}
.pen-prev{position:absolute;right:14px;bottom:14px;background:#fff;border-radius:12px;box-shadow:var(--sh-2);padding:8px 12px 10px;display:flex;align-items:flex-end;gap:12px;z-index:3;pointer-events:none}
.pen-prev span{position:absolute;top:6px;left:12px;font-size:10px;color:var(--ink2);font-weight:600}
.pen-prev i{display:block;margin-top:16px}
.pen-prev .pp1{width:24px;height:24px}.pen-prev .pp2{width:48px;height:48px}
.canvas.pen-mode{cursor:crosshair}
/* ===== 色轮 ===== */
.cw-btn{height:26px;padding:0 8px 0 26px;border:1px solid var(--line);border-radius:7px;background:#fff;font-size:12px;font-weight:600;color:var(--ink);position:relative;white-space:nowrap}
.cw-btn::before{content:"";position:absolute;left:6px;top:5px;width:14px;height:14px;border-radius:50%;background:conic-gradient(red,#ff0,lime,cyan,blue,#f0f,red);box-shadow:inset 0 0 0 3px rgba(255,255,255,.5)}
.cw-btn:hover,.cw-btn.on{border-color:var(--blue);color:var(--blue)}
.cwp{position:absolute;z-index:30;width:240px;background:#fff;border-radius:14px;box-shadow:var(--sh-3);padding:12px;display:flex;flex-direction:column;gap:10px;animation:rise .22s var(--ease)}
.cw-h{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:700}
.cw-x{border:0;background:transparent;font-size:18px;line-height:1;color:var(--ink2);width:24px;height:24px;border-radius:6px}.cw-x:hover{background:#F2F3F5}
.cw-wheel{position:relative;width:216px;height:216px;border-radius:50%;background:radial-gradient(closest-side,#fff,rgba(255,255,255,0)),conic-gradient(from 90deg,red,#ff0,lime,cyan,blue,#f0f,red);cursor:crosshair;touch-action:none;margin:0 auto}
.cw-dark{position:absolute;inset:0;border-radius:50%;background:#000;pointer-events:none}
.cw-knob{position:absolute;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.3),0 2px 6px rgba(0,0,0,.3);pointer-events:none}
.cw-row{display:flex;align-items:center;gap:8px;font-size:12px}
.cw-l{width:28px;color:var(--ink2);font-weight:600}
.cw-b{flex:1;-webkit-appearance:none;appearance:none;height:10px;border-radius:6px;background:linear-gradient(90deg,#000,var(--hue,#f00));outline:none}
.cw-b::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.3),0 1px 4px rgba(0,0,0,.3)}
.cw-b::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:0;box-shadow:0 0 0 1px rgba(0,0,0,.3)}
.cw-bv{width:34px;text-align:right;font-variant-numeric:tabular-nums}
.cwp .chip{width:24px;height:24px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.cw-hex{flex:1;min-width:0;height:28px;border:1px solid var(--line);border-radius:6px;padding:0 8px;font:600 12px ui-monospace,Menlo,monospace;text-transform:uppercase}
.cw-hex:focus{outline:none;border-color:var(--blue)}
.cw-eye{width:28px;height:28px;border:1px solid var(--line);border-radius:6px;background:#fff;display:grid;place-items:center;color:var(--ink)}
.cw-eye.on,.cw-eye:hover{border-color:var(--blue);color:var(--blue);background:#EEF6FF}
.cw-sh{font-size:11px;color:var(--ink2);font-weight:600;margin-bottom:4px}
.cw-sw{display:flex;flex-wrap:wrap;gap:6px}
.cw-sw button{width:22px;height:22px;border-radius:6px;border:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);padding:0}
.cw-sw button:hover{transform:scale(1.12)}
.cw-sw.vi button{width:30px;height:22px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12),0 0 0 2px #fff,0 0 0 3px #9747FF33}
.cw-ct{font-size:12px;display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--line);padding-top:8px}
.cw-hsb{color:var(--ink2);font-variant-numeric:tabular-nums;font-weight:600}
.cw-cr{display:flex;align-items:center;gap:6px}
.cw-pair{width:30px;height:22px;border-radius:5px;background:var(--b);color:var(--a);display:grid;place-items:center;font-weight:800;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}
.cw-cr b{font-variant-numeric:tabular-nums}
.cw-cr em{margin-left:auto;font-style:normal;font-weight:700;padding:1px 6px;border-radius:4px}
.cw-cr em.ok{background:#E3F7EC;color:#0E8A49}.cw-cr em.mid{background:#FFF4DB;color:#A86B00}.cw-cr em.bad{background:#FFE7E2;color:#C2361B}
.canvas.eyedrop,.canvas.eyedrop *{cursor:copy!important}
/* ===== VI ===== */
.ov-vi{border:1.5px dashed #F24822;background:rgba(242,72,34,.06);pointer-events:none}
.ov-vitag{position:absolute;transform:translate(-100%,-100%);background:#F24822;color:#fff;font-size:10px;font-weight:700;padding:1px 5px;border-radius:4px 4px 0 4px;white-space:nowrap;pointer-events:none}
.tb-btn.vi{background:rgba(151,71,255,.22);color:#fff;font-weight:700}
.tb-btn.vi:hover{background:rgba(151,71,255,.4)}
.vi-modal{opacity:0;transition:opacity .2s}.vi-modal.on{opacity:1}
.vi-doc{width:min(640px,100%);padding:0;overflow:auto}
.vi-top{display:flex;align-items:center;gap:10px;padding:18px 22px;background:#1F2329;color:#fff;border-radius:16px 16px 0 0}
.vi-top b{font-family:var(--display);font-size:22px;font-weight:400;letter-spacing:.5px}
.vi-k{font-size:11px;font-weight:700;background:#9747FF;border-radius:4px;padding:2px 6px}
.vi-x{margin-left:auto;border:0;background:transparent;color:#fff;font-size:22px;width:30px;height:30px;border-radius:8px}.vi-x:hover{background:rgba(255,255,255,.12)}
.vi-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:18px 22px}
.vi-sec{border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.vi-sec p{margin:4px 0;font-size:13px;line-height:1.6}
.vi-sec:nth-child(2){grid-row:span 2}
.vi-sh{font-size:11px;color:var(--ink2);font-weight:700;margin-bottom:8px;letter-spacing:1px}
.vi-lg{display:grid;place-items:center;min-height:84px;background:#FAFAFB;border-radius:8px}
.vi-wordmark{font-family:var(--display);font-size:26px;color:#1A1A2E;padding:6px 16px;border-radius:16px}
.vi-cols{display:flex;flex-direction:column;gap:8px}
.vi-c{display:grid;grid-template-columns:40px 1fr auto;grid-template-rows:auto auto;column-gap:10px;align-items:center}
.vi-c i{grid-row:span 2;width:40px;height:40px;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}
.vi-c b{font-size:14px}.vi-c code{font:600 11px ui-monospace,Menlo,monospace;color:var(--ink2)}
.vi-c em{grid-column:2/4;font-style:normal;font-size:11px;color:var(--ink2)}
.vi-t{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:3px 0}.vi-t code,.vi-r code{font:600 11px ui-monospace,Menlo,monospace;color:var(--ink2)}
.vi-r{display:flex;align-items:center;gap:12px}.vi-r i{width:56px;height:40px;background:#EEF4FF;border:2px solid var(--blue)}
.vi-foot{display:flex;align-items:center;justify-content:space-between;padding:12px 22px 18px}
.vi-bad{color:#C2361B;font-weight:700;font-size:13px}.vi-ok{color:#0E8A49;font-weight:700;font-size:13px}
.vi-close{border:0;background:var(--primary);color:#fff;font-weight:700;border-radius:10px;padding:9px 16px}
/* ===== 提示确认 ===== */
.ask .m-card{width:min(340px,100%);text-align:center;padding:26px 24px 20px}
.ask-ico{width:56px;height:56px;margin:0 auto 10px;border-radius:50%;background:#FFF4DB;color:#E09A00;display:grid;place-items:center}
.ask-t{font-family:var(--display);font-size:24px;font-weight:400;display:block}
.ask-p{font-size:14px;color:var(--ink2);margin:8px 0 0}
.ask-m{color:var(--red)}
.ask .m-btns{justify-content:center}.ask .btn{min-width:96px}
/* ===== 项目地图 ===== */
.projs{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:18px}
.pj{background:#fff;border-radius:16px;padding:16px 12px 12px;box-shadow:var(--sh-1);display:flex;flex-direction:column;align-items:center;gap:8px;animation:cardin .6s var(--spring) backwards;animation-delay:var(--d);position:relative;border:2px solid transparent;transition:transform .25s var(--spring),box-shadow .25s}
.pj.cafe{background:#FFFAF3}.pj.night{background:#F7F5FF}
.pj.now{border-color:var(--primary);box-shadow:var(--sh-2);transform:translateY(-3px)}
.pj.lock{opacity:.55;filter:grayscale(.6)}
.pj-av{width:60px;height:60px;border-radius:50%;box-shadow:0 0 0 3px #fff,var(--sh-1)}
.pj-av svg{border-radius:50%;display:block}
.pj-n{font-family:var(--display);font-size:22px;line-height:1;letter-spacing:.5px;color:var(--ink)}
.pj.now .pj-n{color:var(--primary)}
.pj-track{position:relative;display:flex;justify-content:space-between;width:100%;max-width:calc(var(--n) * 56px);padding:4px 0 0;margin-top:2px}
.pj-track[style*="--n:1"]{justify-content:center}
.pj-track::before,.pj-track::after{content:"";position:absolute;top:21px;left:calc(100% / var(--n) / 2);height:4px;border-radius:2px}
.pj-track::before{right:calc(100% / var(--n) / 2);background:#E3E7ED}
.pj-track::after{width:calc((100% - 100% / var(--n)) * var(--p));background:var(--ok);transition:width .5s}
.nd{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:3px;flex:1}
.dr{border:0;background:none;padding:0;cursor:pointer;border-radius:50%;transition:transform .2s var(--spring)}
.dr:hover:not(:disabled){transform:scale(1.12)}
.dr-dot{width:34px;height:34px;border-radius:50%;background:#fff;border:3px solid var(--primary);display:grid;place-items:center;font-style:normal;color:#fff;box-sizing:border-box}
.dr.done .dr-dot{background:var(--ok);border-color:var(--ok);box-shadow:0 2px 0 #1a7f52}
.dr.lock{cursor:not-allowed}.dr.lock .dr-dot{border-color:#D5DBE3;color:#A9B1BC;background:#F2F3F5}
.dr.cur .dr-dot{background:var(--primary);box-shadow:0 0 0 0 rgba(37,99,235,.5);animation:ndpulse 1.4s ease-out infinite}
.dr.cur .dr-dot::after{content:"";width:10px;height:10px;border-radius:50%;background:#fff}
.dr:not(.lock):not(.done):not(.cur) .dr-dot::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--primary)}
@keyframes ndpulse{0%{box-shadow:0 0 0 0 rgba(37,99,235,.55)}70%{box-shadow:0 0 0 12px rgba(37,99,235,0)}100%{box-shadow:0 0 0 0 rgba(37,99,235,0)}}
.nd-s{height:12px;line-height:12px;font-size:10px;font-weight:700;color:#14AE5C;white-space:nowrap}
.pj-f{margin-top:auto;font-size:11px;color:#22A06B;font-weight:700;opacity:.85}
.pj.lock .pj-f{color:var(--ink2)}
.pj-ok{color:var(--ok)}
.pj.done::after{content:"✓";position:absolute;top:-8px;right:-8px;width:24px;height:24px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;font-size:13px;box-shadow:var(--sh-2)}
@media (max-width:900px){.projs{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.projs{grid-template-columns:1fr}}
/* 开场卡：稿子进度 */
.ls-drafts{display:flex;align-items:center;justify-content:center;gap:4px;margin:6px 0 2px}
.ls-drafts i{font-style:normal;font-size:11px;font-weight:700;padding:2px 8px;border-radius:10px;background:#F2F3F5;color:#9AA3AF}
.ls-drafts i.d{background:#E3F7EC;color:#0E8A49}.ls-drafts i.on{background:var(--primary);color:#fff}
.ls-drafts u{width:10px;height:2px;background:#D5D8DE}
/* 结算：项目完成 */
.rs-proj{display:flex;flex-wrap:wrap;align-items:center;gap:6px;background:linear-gradient(90deg,#FFF4DB,#FFFAF0);border-radius:12px;padding:10px 12px;margin-top:12px}
.rs-proj b{font-family:var(--display);font-size:18px;font-weight:400;color:#A86B00}
.rs-proj span{font-weight:700;font-size:13px;margin-right:4px}
.rs-proj i{font-style:normal;font-size:11px;background:#fff;border-radius:8px;padding:2px 8px;color:var(--ink2);font-weight:600}

/* VI 参考图：钉在画布上方的浮动面板 */
.win{position:relative}
.vi-pin{position:absolute;z-index:40;display:flex;flex-direction:column;background:#fff;border-radius:12px;box-shadow:0 0 0 1px rgba(15,23,42,.12),0 12px 32px rgba(15,23,42,.22);overflow:hidden;opacity:0;transform:scale(.96);transform-origin:top right;transition:opacity .18s,transform .18s var(--spring);touch-action:none}
.vi-pin.on{opacity:1;transform:none}
.vi-pin.moving{box-shadow:0 0 0 2px var(--blue),0 18px 40px rgba(15,23,42,.28);cursor:grabbing;transition:none}
.vi-pin.resizing{box-shadow:0 0 0 2px var(--blue),0 12px 32px rgba(15,23,42,.22);transition:none}
.vp-top{display:flex;align-items:center;gap:8px;height:38px;padding:0 6px 0 10px;background:#2C2C2C;color:#fff;cursor:grab;flex:none;user-select:none}
.vp-top b{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.vp-top .vi-k{flex:none}
.vp-zm{display:flex;align-items:center;gap:2px;background:rgba(255,255,255,.08);border-radius:6px;padding:2px;flex:none}
.vp-zm button,.vp-x{border:0;background:transparent;color:#fff;width:22px;height:22px;border-radius:5px;font-size:15px;line-height:1;display:grid;place-items:center}
.vp-zm button:hover,.vp-x:hover{background:rgba(255,255,255,.16)}
.vp-pct{font:600 11px ui-monospace,Menlo,monospace;min-width:34px;text-align:center;color:#ddd}
.vp-x{font-size:18px;flex:none}
.vp-body{flex:1;overflow:auto;background:#F5F5F5 radial-gradient(circle,#D9D9D9 1px,transparent 1.2px) 0 0/14px 14px;cursor:grab;min-height:0;user-select:none}
.vi-pin.moving .vp-body{cursor:grabbing}
.vp-doc{width:560px;margin:14px;background:#fff;border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.vp-doc .vi-grid{padding:16px}
.vp-foot{flex:none;height:30px;display:flex;align-items:center;padding:0 12px;border-top:1px solid var(--line);font-size:12px;background:#fff}
.vp-foot span{font-size:12px}
.vp-rs{position:absolute;right:0;bottom:0;width:18px;height:18px;cursor:nwse-resize;background:linear-gradient(135deg,transparent 55%,#9AA3AF 55% 62%,transparent 62% 72%,#9AA3AF 72% 79%,transparent 79%)}
.tb-btn.vi.on{background:#9747FF;color:#fff}

/* 稿费账单（替代星级） */
.rs-bill{margin:14px 0 12px;background:#F7F7F8;border-radius:12px;padding:10px 14px;font-size:13.5px}
.rs-bill ul{list-style:none;margin:0;padding:0}
.rs-bill li{display:flex;justify-content:space-between;padding:4px 0;color:var(--ink2);animation:billin .35s var(--ease,ease-out) var(--d) backwards}
.rs-bill li b{font-variant-numeric:tabular-nums}
.rs-bill li.up b{color:#14AE5C}.rs-bill li.dn b{color:var(--red)}.rs-bill li.zero{color:#A0A4AB}.rs-bill li.zero b{color:#C0C4CB;font-weight:400}
.rs-total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px dashed #D5D8DE;margin-top:6px;padding-top:8px;animation:billin .35s ease-out var(--d) backwards}
.rs-total span{font-weight:700}.rs-total b{font-family:var(--display);font-weight:400;font-size:30px;color:#14AE5C;font-variant-numeric:tabular-nums}
@keyframes billin{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.rs-bill li,.rs-total{animation:none}}

/* ===== 素材库面板 ===== */
.win.has-assets .order{width:232px}
.coach[data-dir="t"]::before{left:calc(50% - 7px);top:-7px}
.assets{flex:none;width:250px;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;font-size:12px}
.as-h{display:flex;align-items:baseline;gap:8px;padding:12px 14px 8px}
.as-h b{font-size:13px;font-family:var(--display);font-weight:400;letter-spacing:.5px}
.as-h span{color:#8C8C8C;font-size:11px}
.as-search{margin:0 12px;display:flex;align-items:center;gap:6px;height:30px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:#F7F7F8;color:#8C8C8C;transition:.15s}
.as-search:focus-within{border-color:var(--blue);background:#fff;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.as-search input{flex:1;min-width:0;border:0;background:transparent;outline:0;font:inherit;color:#1E1E1E}
.as-x{border:0;background:#DADDE2;color:#fff;width:16px;height:16px;border-radius:50%;line-height:16px;padding:0;font-size:12px}
.as-tabs{display:flex;flex-wrap:wrap;gap:4px;padding:10px 12px 8px;border-bottom:1px solid var(--line)}
.as-tabs button{border:0;background:#F2F3F5;color:#555;font-size:11px;font-weight:600;height:24px;padding:0 9px;border-radius:12px;transition:transform .12s,background .12s}
.as-tabs button:hover{background:#E6E8EB;transform:translateY(-1px)}
.as-tabs button.on{background:#1E1E1E;color:#fff}
.as-tabs button.spot-el{box-shadow:0 0 0 2px var(--blue);animation:pulse 1.2s infinite}
.as-grid{flex:1;overflow:auto;padding:4px 10px 16px}
.as-sec{font-size:11px;font-weight:700;color:#333;padding:10px 4px 6px;display:flex;align-items:center;gap:6px}
.as-sec em{font-style:normal;color:#9AA3AF;font-weight:600}
.as-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.as-t{border:1px solid transparent;background:#F7F6F3;border-radius:10px;padding:6px 4px 4px;display:flex;flex-direction:column;align-items:center;gap:3px;cursor:grab;transition:transform .14s cubic-bezier(.34,1.56,.64,1),background .12s,border-color .12s;touch-action:none}
.as-t:hover{background:#fff;border-color:#E2E4E8;transform:translateY(-2px) rotate(-2deg);box-shadow:0 6px 14px rgba(0,0,0,.08)}
.as-t:active{cursor:grabbing;transform:scale(.94)}
.as-t i{display:block;width:52px;height:44px}
.as-t i svg{width:100%;height:100%}
.as-t.wide i{width:64px;height:36px;border-radius:4px;overflow:hidden}
.as-t span{font-size:10px;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.as-empty{text-align:center;color:#8C8C8C;padding:40px 10px;line-height:1.8}
.as-ghost{position:fixed;z-index:9999;pointer-events:none;width:72px;height:72px;margin:-36px 0 0 -36px;background:#fff;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.2);display:grid;place-items:center;transform:rotate(-6deg) scale(.9);transition:transform .15s}
.as-ghost.over{transform:rotate(4deg) scale(1.1)}
.as-ghost i{display:block;width:54px;height:54px}.as-ghost i svg{width:100%;height:100%}
.canvas.drop-ok .artboard{outline:2px dashed var(--blue);outline-offset:4px}
.node.svg{pointer-events:auto}
.node.svg>svg{pointer-events:none}
/* 旋转把手 */
.h-rot{position:absolute;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;background:#fff;border:1.5px solid var(--blue);color:var(--blue);display:grid;place-items:center;pointer-events:auto;cursor:grab;transition:transform .12s}
.h-rot svg{width:12px;height:12px}
.h-rot:hover,.h-rot.on{transform:scale(1.2);background:var(--blue);color:#fff}
.h-stem{position:absolute;width:1.5px;height:24px;margin:-24px 0 0 -.75px;background:var(--blue);transform-origin:50% 100%}
.ov-pill.rot{font-variant-numeric:tabular-nums}
.rot-q{grid-column:span 2;display:flex;gap:4px;margin-top:2px}
.rot-q button,.obtn button{flex:1;height:26px;border:1px solid var(--line);background:#fff;border-radius:6px;font-size:11px;color:#333}
.rot-q button:hover,.obtn button:hover{background:#F5F5F5}
.obtn{display:flex;gap:6px;margin-top:8px}
.obtn kbd{font-size:9px;color:#999;font-family:inherit;margin-left:2px}
.obtn .del:hover{color:#E5484D;border-color:#F3B4B6;background:#FFF5F5}
.seg.ff button{font-size:11px}
.grid2.mt{margin-top:8px}
.slg{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.slg button{text-align:left;border:1px solid var(--line);background:#fff;border-radius:8px;height:30px;padding:0 10px;font-size:12px;color:#333;transition:.12s}
.slg button:hover{border-color:#C9CDD4;transform:translateX(2px)}
.slg button.on{border-color:var(--blue);background:#EEF4FF;color:var(--blue);font-weight:700}
.slg-in{display:flex;gap:4px;margin-top:6px}
.slg-in input{flex:1;min-width:0;height:28px;border:1px solid var(--line);border-radius:6px;padding:0 8px;font:inherit;font-size:12px}
.slg-in button{height:28px;border:0;background:#1E1E1E;color:#fff;border-radius:6px;padding:0 10px;font-size:11px}
/* LOGO 缩小预览 */
.logo-prev{position:absolute;right:14px;bottom:14px;background:#fff;border-radius:12px;box-shadow:var(--sh-2);padding:22px 14px 10px;display:flex;align-items:flex-end;gap:14px;z-index:3;pointer-events:none}
.logo-prev span{position:absolute;top:6px;left:12px;font-size:10px;color:var(--ink2);font-weight:600}
.logo-prev i{display:block}.logo-prev .lp1{width:20px;height:20px}.logo-prev .lp2{width:36px;height:36px}.logo-prev .lp3{width:64px;height:64px}
.ls-drafts{flex-wrap:wrap;max-width:460px;margin-left:auto;margin-right:auto}
.ls-drafts i{font-size:10px;padding:2px 6px}
.ls-drafts u{width:6px}

/* ===== 招牌挂上门头 ===== */
.hang{position:fixed;inset:0;z-index:50;overflow:hidden;background:#FFC99A}
.hg-bg{position:absolute;inset:0;width:100%;height:100%}
.hg-sign{position:absolute;left:50%;top:4vh;transform:translate(-50%,0);transform-origin:50% -4vh;display:flex;flex-direction:column;align-items:center;filter:drop-shadow(0 18px 24px rgba(60,20,10,.35))}
.hg-rope{position:absolute;top:-4vh;width:3px;height:calc(4vh + 10px);background:#3B2A22;border-radius:2px}
.hg-rope.l{left:18%}.hg-rope.r{right:18%}
.hg-frame{position:relative;border:8px solid #3B2A22;border-radius:10px;overflow:hidden;background:#fff;box-sizing:content-box}
.hg-board{position:absolute;left:0;top:0;transform-origin:0 0;overflow:hidden}
.hg-board .node{pointer-events:none}
.hg-cap{position:absolute;left:50%;bottom:4vh;transform:translate(-50%,0);background:rgba(255,255,255,.94);border-radius:18px;padding:14px 18px 14px;box-shadow:0 12px 30px rgba(0,0,0,.18);display:flex;align-items:center;gap:16px;white-space:nowrap}
.hg-cap b{font-family:var(--display);font-weight:400;font-size:24px;letter-spacing:1px;color:#3B2A22}
.hg-cap p{display:flex;align-items:center;gap:8px;margin:0;font-size:14px;color:#333}
.hang .cf{top:-10px}
@media (max-width:900px){.hg-cap{flex-direction:column;gap:8px;white-space:normal;width:86vw}}
.ov-gcol{position:absolute;background:rgba(242,85,120,.10);border-left:1px solid rgba(242,85,120,.35);border-right:1px solid rgba(242,85,120,.35);pointer-events:none}
.tb-btn.grid.on{color:#E2456E}
.projs{grid-template-columns:repeat(3,1fr)}
.pj-avs{display:flex;justify-content:center;padding-left:10px}
.pj-avs .pj-av{width:48px;height:48px;margin-left:-10px}
.rs-bub .rs-q2{margin-top:6px;animation:q2in .4s ease-out 1.6s backwards}
@keyframes q2in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (max-width:900px){.projs{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.projs{grid-template-columns:1fr}}

/* ===== Phase 0.1：大对话框 / 居中选项 / 一页一个项目 ===== */
.talk{padding:0 32px 36px}
.tbox{width:min(1180px,94vw);padding:30px 40px 34px;gap:30px;border-radius:24px;align-items:flex-start}
.tbox .tav svg{width:120px;height:120px}
.temo{left:100px;top:-22px;font-size:48px}
.tname{font-size:28px!important;margin-bottom:10px}
.ttext{font-size:clamp(26px,2.6vw,38px);line-height:1.45;min-height:110px;letter-spacing:.5px}
.tnext{font-size:15px;right:28px;bottom:14px}
.skip{font-size:16px;padding:10px 20px;top:24px;right:28px}
.talk.choosing{align-items:center;padding-bottom:0;background:rgba(20,24,36,.42)}
.talk.choosing .tbox{flex-direction:column;align-items:center;text-align:center;width:min(860px,92vw);padding:40px 48px 44px;gap:18px;animation:chpop .5s cubic-bezier(.34,1.56,.64,1)}
.talk.choosing .tmain{width:100%;display:flex;flex-direction:column;align-items:center}
.talk.choosing .ttext{min-height:0;font-size:32px;color:var(--ink2)}
.talk.choosing .tchoices{width:100%;gap:16px;margin-top:22px}
.talk.choosing .choice{font-size:clamp(24px,2.3vw,32px);padding:22px 28px;border-radius:18px;gap:18px;border-width:2px;background:#fff;box-shadow:var(--sh-1)}
.talk.choosing .choice b{width:44px;height:44px;border-radius:12px;font-size:22px}
.talk.choosing .choice:hover{transform:scale(1.03);border-color:var(--primary);background:#EEF4FF}
@keyframes chpop{from{transform:scale(.8);opacity:0}to{transform:none;opacity:1}}

.map.pager{flex-direction:column;justify-content:flex-start;padding:22px 0 18px;overflow:hidden}
.pg-top{width:min(1240px,92vw);display:flex;align-items:center;gap:28px;flex:none}
.pg-top .gtitle{margin:0;font-size:30px;flex:none}
.pg-top .fund{flex:1;margin:0;background:rgba(255,255,255,.88);backdrop-filter:blur(8px)}
.pg-top .home{flex:none}
.pg-stage{flex:1;width:100%;overflow:hidden;display:flex;align-items:stretch;padding:22px 0}
.pg-row{display:flex;width:100%;will-change:transform}
.pg{flex:0 0 100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;box-sizing:border-box;margin:0;padding:40px 24px;position:relative;
  background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-radius:32px;box-shadow:var(--sh-3);max-width:min(1100px,82vw);margin-inline:calc((100% - min(1100px,82vw))/2);transition:opacity .4s,filter .4s}
.pg:not(.on){opacity:.35;filter:blur(1px)}
.pg.cafe{background:rgba(255,250,243,.96)}.pg.night{background:rgba(247,245,255,.96)}
.pg.lock .pg-av,.pg.lock .pg-n{filter:grayscale(.8);opacity:.55}
.pg-av{position:relative;border-radius:50%;box-shadow:0 0 0 8px #fff,var(--sh-2)}
.pg-av svg{display:block;border-radius:50%;width:clamp(140px,22vh,210px);height:auto}
.pg-ok{position:absolute;right:4px;bottom:4px;width:54px;height:54px;border-radius:50%;background:var(--ok);display:grid;place-items:center;box-shadow:0 0 0 5px #fff}
.pg-n{font-family:var(--display);font-size:clamp(44px,6vw,76px);line-height:1;letter-spacing:2px;color:var(--ink)}
.pg-track{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;row-gap:18px;max-width:100%}
.pg-track .dr-dot{width:64px;height:64px;border-width:5px}
.pg-track .dr.cur .dr-dot::after{width:20px;height:20px}
.pg-track .dr:not(.lock):not(.done):not(.cur) .dr-dot::after{width:16px;height:16px}
.pg-track .dr.lock .dr-dot svg{width:24px}
.pg-track .dr.cur .dr-dot{animation:ndpulse2 1.4s ease-out infinite}
@keyframes ndpulse2{0%{box-shadow:0 0 0 0 rgba(37,99,235,.55)}70%{box-shadow:0 0 0 22px rgba(37,99,235,0)}100%{box-shadow:0 0 0 0 rgba(37,99,235,0)}}
.pg-ln{width:clamp(18px,4vw,56px);height:6px;border-radius:3px;background:#E3E7ED;flex:none}
.pg-ln.on{background:var(--ok)}
.pg-sc{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#F2F3F5;color:#B4BCC7;flex:none}
.pg-sc.on{background:#FFF1D6;color:#C98A1B}
.pg-f{height:28px;font-size:22px;font-weight:700;color:var(--ok)}
.pg-arw{position:absolute;top:52%;transform:translateY(-50%);width:76px;height:76px;border-radius:50%;border:0;background:#fff;color:var(--ink);box-shadow:var(--sh-2);display:grid;place-items:center;cursor:pointer;z-index:3;transition:transform .25s cubic-bezier(.34,1.56,.64,1),opacity .2s}
.pg-arw.prev{left:max(12px,calc((100vw - min(1100px,82vw))/2 - 100px))}.pg-arw.next{right:max(12px,calc((100vw - min(1100px,82vw))/2 - 100px))}
.pg-arw:hover:not(:disabled){transform:translateY(-50%) scale(1.12);color:var(--primary)}
.pg-arw:active:not(:disabled){transform:translateY(-50%) scale(.94)}
.pg-arw:disabled{opacity:0;pointer-events:none}
.map.pager .map-foot{flex:none;margin:0}
@media (max-width:760px){.pg-top{flex-wrap:wrap;gap:10px}.pg-track .dr-dot{width:46px;height:46px}.pg-arw{width:52px;height:52px}.ttext{font-size:22px}.tbox .tav svg{width:72px;height:72px}}
.pg-track .dr{position:relative;flex:none}
.pg-av svg{width:auto}
.pg-av>svg{width:clamp(140px,22vh,210px);height:auto}
.pg-ok svg{width:30px;height:30px}
.pg-ln{width:clamp(12px,2.2vw,56px)}
.ttext{font-size:clamp(30px,3vw,46px);min-height:130px}
.tbox .tav svg{width:140px;height:140px}
.tname{font-size:30px!important}
.temo{left:118px}
.talk.choosing .tbox .tav svg{width:110px;height:110px}
.talk.choosing .ttext{font-size:32px;min-height:0}
.ttext{font-size:clamp(32px,3.4vw,52px);min-height:150px}
/* ---------- v5：新工具 ---------- */
.node.para{white-space:normal;word-break:normal;overflow-wrap:normal}
.node.ink{pointer-events:none}
.node.ink svg path{pointer-events:stroke}
.canvas.ink-mode,.canvas.ink-mode .node{cursor:crosshair}
.seg.cons button,.seg.bwp button,.seg.exf button,.seg.exs button,.seg.pind button,.seg.palign button,.seg.pstrict button,.seg.phyph button{flex:1}
.seg.bwp{flex-wrap:wrap}
.cs-list{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.cs-it{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;border:1px solid transparent;background:none;font:inherit;font-size:13px;color:var(--ink);text-align:left;cursor:pointer}
button.cs-it:hover{background:#F2F3F5}
.cs-it.on{border-color:var(--blue);background:#EEF6FF}
.cs-it i{flex:none;width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.cs-it span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-hex{width:76px;border:1px solid var(--line);border-radius:6px;padding:3px 6px;font:12px ui-monospace,Menlo,monospace;text-transform:uppercase}
.cs-hex:focus{outline:0;border-color:var(--blue)}
.cs-new,.ts-new,.ts-off{border:1px dashed #C9CDD4;background:#fff;border-radius:8px;padding:5px 10px;font-size:14px;color:var(--ink2);cursor:pointer}
.cs-new:hover,.ts-new:hover{border-color:var(--blue);color:var(--blue)}
.ts-row{display:flex;gap:6px;align-items:center;margin-top:6px}
.ts-row select{flex:1;min-width:0;border:1px solid var(--line);border-radius:8px;padding:6px 8px;font:inherit;font-size:13px;background:#fff}
.ts-on{flex:1;display:flex;align-items:center;gap:8px;background:#F2F3F5;border-radius:8px;padding:6px 10px;font-size:13px}
.ts-on b{font-size:15px}
.ts-list{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.ts-it{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;background:#F7F8FA;font-size:13px}
.ts-it b{width:26px;font-size:16px}
.ts-it span{flex:1}
.ts-it em{font-style:normal;color:var(--ink2);font-size:12px}
.lbl-in input{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:8px;padding:6px 8px;font:inherit;font-size:13px;margin-top:6px}
.note{font-size:12px;color:var(--ink2);padding:6px 14px}
.pl-last{font-size:13px;background:#F7F8FA;border-radius:8px;padding:6px 8px;margin-top:6px;min-height:20px}
.ex-btn,.mk-comp{width:100%;margin-top:8px;border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 10px;font:inherit;font-size:13px;display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.ex-btn:hover,.mk-comp:hover{border-color:var(--blue);color:var(--blue)}
.ex-btn kbd{font-size:11px;color:var(--ink2);font-family:inherit}
.exsec .sh em{font-style:normal;font-weight:400;color:var(--ok);font-size:12px;margin-left:8px}
.ex-card{width:340px;background:#fff;border-radius:16px;padding:20px 22px;box-shadow:var(--sh-3)}
.ex-card h3{margin:0 0 12px;font-size:18px}
.ex-prev{position:relative;overflow:hidden;margin:0 auto 6px;border-radius:6px;box-shadow:0 0 0 1px var(--line)}
.ex-prev .artboard{position:absolute;left:0;top:0;margin:0}
.ex-name{display:flex;justify-content:space-between;margin-top:14px;font-size:13px}
.ex-name span{color:var(--ink2)}
.kp{display:inline}
/* ---------- 小游戏 ---------- */
.mg{position:fixed;inset:0;z-index:70;display:grid;place-items:center;background:rgba(18,20,30,.62);backdrop-filter:blur(4px);user-select:none;-webkit-user-select:none;transition:opacity .22s}
.mg.out{opacity:0}
.talk.gaming{pointer-events:none}
.talk.gaming .tbox{opacity:.25}
.hd-card,.fl-card,.ky-card{background:#fff;border-radius:24px;box-shadow:0 30px 80px rgba(0,0,0,.35);padding:30px 36px 34px;width:min(720px,92vw);display:flex;flex-direction:column;gap:18px}
.hd-top{display:flex;gap:20px;align-items:center}
.hd-av{flex:none}
.hd-bub{flex:1;background:#F2F3F5;border-radius:6px 18px 18px 18px;padding:14px 18px;min-height:64px}
.hd-bub b{display:block;font-size:14px;color:var(--ink2);margin-bottom:4px}
.hd-bub p{margin:0;font-size:24px;font-family:var(--display)}
.hd-val{text-align:center;font-family:var(--display);font-size:72px;line-height:1;font-variant-numeric:tabular-nums;color:var(--ink);transition:color .15s}
.hd-val.ok{color:var(--ok)}
.hd-gauge{position:relative;height:30px;border-radius:15px;background:linear-gradient(90deg,#FFE3DB,#F2F3F5 40%,#F2F3F5 60%,#FFE3DB);margin-bottom:18px}
.hd-zone{position:absolute;top:0;bottom:0;background:rgba(20,174,92,.35);border:2px solid var(--ok);border-radius:15px;box-sizing:border-box;transition:left .5s var(--spring),width .5s}
.hd-mark{position:absolute;top:-8px;bottom:-8px;width:6px;margin-left:-3px;border-radius:3px;background:var(--ink)}
.hd-l,.hd-r{position:absolute;top:36px;font-size:13px;color:var(--ink2)}
.hd-l{left:0}.hd-r{right:0}
.hd-prog{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:700}
.hd-bar,.hd-time,.fl-time,.ky-time{flex:1;height:12px;border-radius:6px;background:#F2F3F5;overflow:hidden}
.hd-bar i,.hd-time i,.fl-time i,.ky-time i{display:block;height:100%;width:0;background:var(--ok);border-radius:6px}
.hd-time{height:6px;flex:none}.hd-time i,.fl-time i,.ky-time i{background:#FFC700;width:100%}
.hd-btn{font-size:26px;padding:20px;border-radius:18px;touch-action:none;transition:transform .1s}
.hd-btn.on{transform:scale(.96);background:var(--primary-d)}
.mg.poster{background:linear-gradient(#BFD7EA,#E8EEF4 60%,#9AA3AD 60%,#8A939D)}
.pg-street{position:absolute;inset:0;overflow:hidden}
.pg-poles{position:absolute;left:0;right:0;top:12%;bottom:40%}
.pole{position:absolute;top:0;bottom:0;width:0}
.pl-stick{position:absolute;left:-9px;top:0;bottom:-40%;width:18px;background:linear-gradient(90deg,#6B7480,#A5AEB8,#6B7480);border-radius:4px}
.pl-slot{position:absolute;left:-40px;top:22%;width:80px;min-height:110px;display:grid;place-items:center}
.pole.miss .pl-stick{filter:grayscale(1) brightness(.8)}
.pg-hand{position:absolute;left:50%;top:calc(12% + 22% * .6 + 10px);transform:translate(-50%,0);filter:drop-shadow(0 10px 18px rgba(0,0,0,.25));pointer-events:none;z-index:2}
.pg-hand::after{content:"";position:absolute;left:50%;top:100%;width:2px;height:40vh;background:rgba(255,255,255,.6);transform:translateX(-50%)}
.pg-hud{position:absolute;left:24px;top:20px;display:flex;align-items:center;gap:14px;background:#fff;border-radius:18px;padding:8px 18px 8px 8px;box-shadow:var(--sh-2)}
.pg-cnt{font-size:22px;font-family:var(--display)}
.pg-cnt b{font-size:34px}
.pg-btn{position:absolute;left:50%;bottom:8%;transform:translateX(-50%);font-size:34px;padding:22px 64px;border-radius:24px}
.pp-mini{position:relative;overflow:hidden;border-radius:3px;box-shadow:0 2px 8px rgba(0,0,0,.25);background:#fff}
.pp-fb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:#fff;border-radius:3px;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.pp-fb b{font-size:20px}.pp-fb i{font-style:normal;font-size:9px}
.fl-card{width:auto;align-items:center}
.fl-h{display:flex;justify-content:space-between;align-items:center;width:100%;gap:20px}
.fl-tag{background:#F4ECFF;color:var(--purple);font-weight:800;padding:6px 14px;border-radius:99px}
.fl-n{font-family:var(--display);font-size:28px}
.fl-time{width:100%;flex:none}
.fl-fit{position:relative;flex:none}
.fl-stage{position:relative;width:360px;height:640px;transform-origin:0 0}
.ai-scr{position:absolute;inset:0;background:linear-gradient(#F7F0FF,#fff);border-radius:22px;overflow:hidden;box-shadow:0 0 0 2px #E6DAFF}
.ai-bar{height:48px;display:flex;align-items:center;padding:0 18px;color:#fff;background:linear-gradient(90deg,#9747FF,#F24822);font-weight:800}
.ai-ttl{position:absolute;left:30px;top:76px;width:200px;white-space:nowrap;font-size:26px;font-weight:800}
.ai-hand{position:absolute;left:236px;top:146px}
.ai-ic{position:absolute;left:40px;top:150px;font-size:60px}
.ai-fs{position:absolute;left:24px;top:276px;width:190px;display:flex;flex-wrap:wrap;gap:6px}
.ai-fs span{background:#FFE7F0;color:#D6336C;border-radius:6px;padding:2px 6px}
.ai-row{position:absolute;left:0;top:440px;width:100%;height:80px}
.ai-row i{position:absolute;top:0;width:64px;height:80px;border-radius:12px;background:#E6DAFF;display:grid;place-items:center;font-style:normal;font-weight:800;color:var(--purple)}
.ai-buy{position:absolute;left:24px;top:572px;width:300px;height:52px;display:flex;align-items:center;padding-left:18px;border-radius:26px;background:var(--purple);color:#fff;overflow:hidden}
.ai-buy b{white-space:nowrap}
.fl-hit{position:absolute;border:0;background:transparent;border-radius:12px;cursor:pointer;padding:0}
.fl-hit.on{box-shadow:0 0 0 4px var(--red);background:rgba(242,72,34,.08);animation:chpop .35s var(--spring)}
.fl-hit.on em{position:absolute;left:50%;top:-14px;transform:translate(-50%,-100%);white-space:nowrap;background:var(--red);color:#fff;font-style:normal;font-weight:800;font-size:14px;padding:4px 10px;border-radius:8px}
.ky-card{align-items:center;text-align:center}
.ky-h{display:flex;align-items:center;gap:16px;align-self:stretch}
.ky-h p{flex:1;margin:0;text-align:left;font-size:24px;font-family:var(--display);background:#F2F3F5;border-radius:6px 18px 18px 18px;padding:12px 16px}
.ky-cap{display:flex;align-items:center;gap:14px;min-height:120px;transition:transform .12s}
.ky-cap kbd{font-family:var(--font);font-size:44px;font-weight:800;min-width:90px;padding:18px 24px;border-radius:18px;background:#fff;border:3px solid var(--ink);box-shadow:0 6px 0 var(--ink);color:var(--ink)}
.ky-cap span{font-size:36px;color:var(--ink2)}
.ky-cap.ok kbd{border-color:var(--ok);box-shadow:0 6px 0 var(--ok);color:var(--ok)}
.ky-cap.bad{animation:kyshake .16s}
.ky-cap.bad kbd{border-color:var(--red);box-shadow:0 6px 0 var(--red)}
@keyframes kyshake{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
.ky-dots{display:flex;gap:10px}
.ky-dots i{width:16px;height:16px;border-radius:50%;background:#E5E6EB}
.ky-dots i.ok{background:var(--ok)}.ky-dots i.no{background:var(--red)}
.ky-time{width:100%;flex:none}
/* ---------- 终局 HUD ---------- */
.boss-hud{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:65;display:flex;align-items:center;gap:22px;background:rgba(30,30,40,.9);color:#fff;border-radius:20px;padding:8px 18px;box-shadow:0 10px 30px rgba(0,0,0,.3);pointer-events:none}
.bh-ai{display:flex;align-items:center;gap:10px}
.bh-ai b{background:linear-gradient(90deg,#9747FF,#F24822);padding:2px 10px;border-radius:8px;font-size:14px}
.bh-bar{width:220px;height:14px;border-radius:7px;background:rgba(255,255,255,.15);overflow:hidden}
.bh-bar i{display:block;height:100%;background:linear-gradient(90deg,#9747FF,#F24822);transition:width .6s var(--spring)}
.bh-n{font-variant-numeric:tabular-nums;font-weight:800;min-width:30px}
.bh-me{display:flex;align-items:center;gap:8px}
.bh-me svg{border-radius:50%}
.bh-h{display:flex;gap:4px}
.bh-h i svg{display:block;fill:rgba(255,255,255,.2)}
.bh-h i.on svg{fill:#FF4D6A}
.bh-say{position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%);background:#fff;color:var(--ink);border-radius:14px;padding:8px 16px;white-space:nowrap;font-family:var(--display);font-size:20px;box-shadow:var(--sh-2)}
.bh-say p{margin:0}
.end-note{display:flex;align-items:center;gap:14px;justify-content:center;margin:18px auto 0;background:#fff;border-radius:16px;padding:10px 18px;box-shadow:var(--sh-1);width:fit-content}
.end-note p{margin:0;font-size:18px}
.end-note b{margin-right:6px}
/* 自由接单 */
.pg-top .free-go{flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 22px;border-radius:18px;border:0;background:#1F2329;color:#fff;cursor:pointer;box-shadow:0 6px 0 #000;transition:transform .15s}
.pg-top .free-go:hover{transform:translateY(-2px)}
.pg-top .free-go b{font-size:20px}
.pg-top .free-go span{font-size:14px;color:#FFD666}
.free-win .m-reward .fr-tot{margin-left:10px;font-size:.8em;opacity:.7}

/* 小游戏卡片：按钮高度跟内容走，矮屏收紧，永远不裁切 */
.mg .btn{height:auto;line-height:1.2}
.hd-card,.fl-card,.ky-card{max-height:calc(100vh - 24px);overflow:auto;box-sizing:border-box}
.hd-btn{flex:none;margin-top:4px}
@media (max-height:760px){
  .hd-card,.fl-card,.ky-card{padding:22px 30px 26px;gap:12px}
  .hd-av svg{width:88px;height:88px}
  .hd-val{font-size:56px}
  .hd-btn{font-size:24px;padding:16px}
  .pg-btn{font-size:28px;padding:16px 52px}
}
/* 结算卡：矮屏收紧，按钮不出屏 */
@media (max-height:760px){
  .rs-wrap .m-card{padding:16px 22px 14px}
  .rs-wrap .rs-k{font-size:21px}
  .rs-bill{margin:8px 0 6px;padding:6px 12px}
  .rs-bill li{padding:2px 0}
  .rs-total{margin-top:3px;padding-top:4px}.rs-total b{font-size:24px}
  .rs-head{margin:4px 0 6px}
  .rs-por svg{width:60px;height:60px}.rs-mood{font-size:22px}
  .rs-bub{padding:6px 12px}.rs-bub b{font-size:17px}.rs-bub p{font-size:14px;line-height:1.45}
  .vs{margin-top:6px}.vs-col{gap:2px}.vs-r{padding:1px 8px}
  .m-fail .rs-head{margin-top:26px}
  .rs-tip{margin:8px 0;padding:8px 12px}
  .rs .m-btns{margin-top:10px}
}
/* 工贼小王：西装领带的灰白，替换原来 AI 的紫粉渐变 */
.bh-ai svg{border-radius:50%;flex:none;box-shadow:0 0 0 2px #fff}
.bh-ai b{background:#E5484D;white-space:nowrap}
.bh-say b{display:block;font-family:var(--font);font-size:12px;color:var(--ink2);font-weight:700}
.bh-say[data-k=wang]{box-shadow:0 0 0 2px #E5484D,var(--sh-2)}
.vs-h.ai,.ai-chip{background:#475569}
.fl-tag{background:#FFE9E9;color:#C9302C}
.bh-bar i{background:linear-gradient(90deg,#FF8A80,#E5484D)!important}

/* ================= 小游戏 & 终局 HUD：统一成游戏本身的“贴纸”风格 =================
   奶油纸 + 咖啡墨描边 + 唯一强调色（招牌黄），跟顶栏 HUD、需求单同一套语言 */
:root{--paper:#FFF8EC;--paper2:#F3E6D2;--cof:#2B2420;--cof2:#8A7A6C;--acc:#FFC93C;--acc-d:#E8A913}
.mg{background:rgba(43,32,26,.5);backdrop-filter:blur(6px) saturate(.9)}
.hd-card,.fl-card,.ky-card{background:var(--paper);color:var(--cof);border-radius:28px;box-shadow:0 0 0 3px var(--cof),0 8px 0 var(--cof),0 30px 70px rgba(43,32,26,.4)}
.hd-card{width:min(620px,92vw);padding:26px 32px 30px;gap:14px}
/* 老周 + 气泡 */
.hd-top{gap:18px}
.hd-av svg,.ky-h>svg{display:block;border-radius:50%;box-shadow:0 0 0 3px var(--cof);background:#FFE7B8}
.hd-bub,.ky-h p{position:relative;background:#fff;border-radius:6px 20px 20px 20px;box-shadow:0 0 0 2px var(--cof);padding:12px 18px;min-height:0}
.hd-bub::before,.ky-h p::before{content:"";position:absolute;left:-9px;top:14px;width:14px;height:14px;background:#fff;border-left:2px solid var(--cof);border-bottom:2px solid var(--cof);transform:rotate(45deg);border-radius:0 0 0 3px}
.hd-bub b{color:var(--cof2);font-size:13px}
.hd-bub p{font-size:22px;color:var(--cof)}
/* 报价：主角 */
.hd-val{width:fit-content;margin:4px auto 0;padding:0 14px;font-size:88px;color:var(--cof);border-radius:14px;transition:transform .35s var(--spring),background-size .3s var(--ease);background:linear-gradient(transparent 60%,var(--acc) 60%,var(--acc) 92%,transparent 92%) no-repeat 0 0/0% 100%}
.hd-val.ok{color:var(--cof);transform:scale(1.06) rotate(-1.5deg);background-size:100% 100%}
/* 能谈的区间 */
.hd-gauge{height:38px;border-radius:19px;background:var(--paper2);box-shadow:inset 0 0 0 2px var(--cof),inset 0 4px 0 rgba(43,32,26,.08);margin:6px 0 22px}
.hd-zone{top:0;bottom:0;border:2px solid var(--cof);border-radius:19px;background:repeating-linear-gradient(-45deg,rgba(255,201,60,.75) 0 8px,rgba(255,201,60,.4) 8px 16px);transition:left .55s var(--spring),width .55s var(--spring),background .2s}
.hd-gauge.in .hd-zone{background:var(--acc);animation:hdpulse .7s var(--ease) infinite alternate}
@keyframes hdpulse{to{box-shadow:0 0 0 6px rgba(255,201,60,.35)}}
.hd-mark{top:-9px;bottom:-9px;width:8px;margin-left:-4px;border-radius:4px;background:var(--cof)}
.hd-mark::after{content:"";position:absolute;left:50%;top:-10px;width:20px;height:20px;margin-left:-10px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px var(--cof)}
.hd-l,.hd-r{top:46px;font-size:12px;font-weight:700;color:var(--cof2);font-variant-numeric:tabular-nums}
/* 底气 */
.hd-prog{gap:14px}
.hd-prog span{font-family:var(--display);font-weight:400;font-size:22px;color:var(--cof)}
.hd-bar{height:20px;border-radius:10px;background:var(--paper2);box-shadow:inset 0 0 0 2px var(--cof)}
.hd-bar i{background:repeating-linear-gradient(-45deg,var(--acc) 0 10px,#FFD866 10px 20px);border-radius:10px;box-shadow:inset 0 0 0 2px var(--cof);transition:width .12s linear}
/* 倒计时：所有小游戏同一根细墨线 */
.hd-time,.fl-time,.ky-time{height:6px;border-radius:3px;background:rgba(43,32,26,.12)}
.hd-time i,.fl-time i,.ky-time i{background:var(--cof);opacity:.55;border-radius:3px}
/* 大按钮：黄贴纸，按下会压扁 */
.mg .btn.hd-btn,.mg .btn.pg-btn{background:var(--acc);color:var(--cof);border:0;font-family:var(--display);font-weight:400;font-size:32px;letter-spacing:2px;border-radius:22px;box-shadow:0 0 0 3px var(--cof),0 7px 0 var(--cof);transition:transform .12s var(--spring),box-shadow .12s}
.mg .btn.hd-btn{padding:18px;margin-top:8px}
.mg .btn.hd-btn:hover,.mg .btn.pg-btn:hover{background:#FFD45C}
.mg .btn.hd-btn.on,.mg .btn.hd-btn:active{background:var(--acc-d);transform:translateY(6px) scale(.99);box-shadow:0 0 0 3px var(--cof),0 1px 0 var(--cof)}
.mg .btn.pg-btn:active{transform:translate(-50%,6px);box-shadow:0 0 0 3px var(--cof),0 1px 0 var(--cof)}
/* 贴启事：傍晚的街 */
.mg.poster{background:linear-gradient(#F4C9A2,#FBE3C8 58%,#C9B39E 58%,#B39C86);backdrop-filter:none}
.pl-stick{background:linear-gradient(90deg,#5A463B,#8C7566,#5A463B);box-shadow:0 0 0 2px var(--cof)}
.pg-hand::after{background:rgba(43,32,26,.25)}
.pg-hud{background:var(--paper);border-radius:20px;box-shadow:0 0 0 3px var(--cof),0 6px 0 var(--cof);padding:6px 20px 6px 6px}
.pg-av svg{display:block;border-radius:50%;box-shadow:0 0 0 2px var(--cof)}
.pg-cnt{color:var(--cof2)}.pg-cnt b{color:var(--cof)}
.pp-mini,.pp-fb{box-shadow:0 0 0 2px var(--cof),0 6px 14px rgba(43,32,26,.25)}
/* 挑毛病 */
.fl-card{padding:22px 26px 26px;gap:14px}
.fl-tag{background:var(--cof);color:var(--acc);font-weight:800;font-size:14px;padding:5px 14px;border-radius:10px}
.fl-n{color:var(--cof);font-size:30px}

.fl-hit.on{box-shadow:0 0 0 4px var(--cof);background:rgba(255,201,60,.4);animation:chpop .4s var(--spring)}
.fl-hit.on em{background:var(--cof);color:var(--acc);border-radius:10px;font-size:15px;padding:5px 12px}
/* 手速 */
.ky-card{padding:24px 32px 30px;gap:16px}
.ky-h p{font-size:22px;color:var(--cof)}
.ky-cap kbd{background:#fff;color:var(--cof);border:3px solid var(--cof);box-shadow:0 7px 0 var(--cof);transition:transform .12s var(--spring)}
.ky-cap span{color:var(--cof2)}
.ky-cap.ok kbd{background:var(--acc);border-color:var(--cof);box-shadow:0 2px 0 var(--cof);color:var(--cof);transform:translateY(5px)}
.ky-cap.bad kbd{background:var(--paper2);border-color:var(--cof);box-shadow:0 7px 0 var(--cof);color:var(--cof2)}
.ky-dots i{width:18px;height:18px;background:var(--paper2);box-shadow:inset 0 0 0 2px rgba(43,32,26,.25);transition:transform .25s var(--spring)}
.ky-dots i.ok{background:var(--acc);box-shadow:inset 0 0 0 2px var(--cof);transform:scale(1.15)}
.ky-dots i.no{background:var(--cof);box-shadow:none}
/* 终局 HUD：跟顶栏同款贴纸 */
.boss-hud{background:var(--paper);color:var(--cof);box-shadow:0 0 0 2px var(--cof),0 4px 0 var(--cof),0 14px 30px rgba(43,32,26,.25);border-radius:18px;padding:6px 16px 6px 8px}
.bh-ai svg{box-shadow:0 0 0 2px var(--cof)}
.bh-ai b{background:var(--cof)!important;color:var(--acc);font-size:13px;padding:3px 10px}
.bh-bar{height:16px;border-radius:8px;background:var(--paper2);box-shadow:inset 0 0 0 2px var(--cof)}
.bh-bar i{background:repeating-linear-gradient(-45deg,var(--acc) 0 10px,#FFD866 10px 20px)!important;box-shadow:inset 0 0 0 2px var(--cof);border-radius:8px}
.bh-n{color:var(--cof)}
.bh-me svg{box-shadow:0 0 0 2px var(--cof)}
.bh-h i svg{fill:var(--paper2);stroke:var(--cof);stroke-width:1.5px}
.bh-h i.on svg{fill:var(--cof)}
.bh-say{background:#fff;color:var(--cof);box-shadow:0 0 0 2px var(--cof),0 4px 0 var(--cof);border-radius:6px 16px 16px 16px}
.bh-say[data-k=wang]{background:var(--paper);box-shadow:0 0 0 2px var(--cof),0 4px 0 var(--cof)}
.bh-say[data-k=wang] b{color:var(--cof)}
.vs-h.ai,.ai-chip{background:var(--cof2)}
@media (max-height:760px){
  .hd-card{padding:18px 28px 22px;gap:10px}
  .hd-av svg{width:80px;height:80px}
  .hd-val{font-size:62px}
  .mg .btn.hd-btn{font-size:26px;padding:14px}
  .mg .btn.pg-btn{font-size:28px;padding:14px 52px}
  .fl-card,.ky-card{padding:18px 24px 22px;gap:10px}
}
/* ---------- 画框 F / 原型 / 演示 ---------- */
.canvas.fr-mode{cursor:crosshair}
.canvas.fr-mode .node{cursor:crosshair}
.ov-frname{font-size:11px;color:#8A8F98;white-space:nowrap;pointer-events:none;line-height:14px}
.ov-frname.on{color:var(--blue)}
.ov-frdraw{border:1.5px solid var(--blue);background:rgba(13,153,255,.06)}
.ptabs{display:flex;gap:4px;padding:8px 12px 0;border-top:1px solid var(--line)}
.ptabs button{flex:1;border:0;background:transparent;padding:6px 0;font-size:12px;font-weight:700;color:var(--ink2);border-bottom:2px solid transparent}
.ptabs button.on{color:var(--ink);border-bottom-color:var(--ink)}
.ov-links{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}
.ov-links path{fill:none;stroke:#0D99FF;stroke-width:2}
.ov-ldot{width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#0D99FF;box-shadow:0 0 0 2px #fff;pointer-events:none}
.ov-larr{width:0;height:0;margin:-6px 0 0 -9px;border:6px solid transparent;border-left:9px solid #0D99FF;border-right:0;pointer-events:none}
.ov-larr.l{margin-left:0;border-left:0;border-right:9px solid #0D99FF}
.ov-ltgt{border:2px solid #0D99FF;background:rgba(13,153,255,.08);pointer-events:none}
.h-link{width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px #0D99FF;pointer-events:auto;cursor:crosshair;display:grid;place-items:center}
.h-link::after{content:"";width:6px;height:6px;border-radius:50%;background:#0D99FF}
.h-link:hover{transform:scale(1.2)}
.pl-row{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--ink2)}
.pl-row select{height:30px;border:1px solid var(--line);border-radius:6px;padding:0 8px;font:inherit;color:var(--ink);background:#fff}
.pp{position:fixed;inset:0;z-index:80;background:#1E1E1E;display:flex;flex-direction:column}
.pp-bar{height:48px;display:flex;align-items:center;gap:12px;padding:0 16px;color:#fff;font-size:13px;border-bottom:1px solid #333}
.pp-bar .pp-fr{color:#9AA0A6}
.pp-x{margin-left:auto;border:0;border-radius:8px;background:#333;color:#fff;padding:6px 12px;font-size:13px}
.pp-x kbd{background:#444;border-color:#555;color:#ddd}
.pp-stage{flex:1;display:grid;place-items:center}
.pp-scr{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.pp-scr .node{cursor:default}
.pp-scr .pp-hot{cursor:pointer}
.pp-scr.in-r{animation:ppin .32s var(--ease)}
.pp-scr.in-l{animation:ppinl .32s var(--ease)}
@keyframes ppin{from{transform:translateX(40px);opacity:.3}}
@keyframes ppinl{from{transform:translateX(-40px);opacity:.3}}
.pp-scr.flash .pp-hot{animation:ppflash .6s}
@keyframes ppflash{30%{box-shadow:0 0 0 3px #0D99FF;background-color:rgba(13,153,255,.25)}}
.artboard.static.pp-ab{pointer-events:auto}
/* ---------- 转场：唰一下，新画面从右边弹进来 ---------- */
.scene-layer.now{transition:none}
::view-transition-group(root){animation-duration:.72s}
::view-transition-old(root){animation:vt-out .6s cubic-bezier(.55,0,.75,.2) both}
::view-transition-new(root){animation:vt-in .72s cubic-bezier(.3,1.35,.55,1) both;box-shadow:-40px 0 80px rgba(43,32,26,.35)}
@keyframes vt-out{to{transform:translateX(-22%) scale(.97);opacity:0;filter:blur(3px)}}
@keyframes vt-in{from{transform:translateX(42%) skewX(-4deg);filter:blur(4px)}60%{filter:none}}
@media (prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}}
/* 需求单进度条和地图页 .pg 撞名：进度条不能被撑成大空框 */
.ticket .pg,.ticket .pg:not(.on),.ticket .tk-pg{background:rgba(31,35,41,.1)!important;border:0!important;transform:none!important;display:block;flex:none;height:10px;padding:0;gap:0;opacity:1;filter:none;min-height:0;width:auto}
/* 抓手 */
.canvas.hand-mode,.canvas.space-pan{cursor:grab}
.canvas.hand-mode .node,.canvas.space-pan .node{cursor:grab!important}
.canvas.panning,.canvas.panning *{cursor:grabbing!important}
.tools .tool.hand:disabled{opacity:1}
/* 客户截图 */
.refshot{position:absolute;right:14px;top:14px;width:156px;z-index:6;background:var(--paper,#FFF8EC);border-radius:14px;padding:8px 8px 10px;box-shadow:0 0 0 2px #2B2420,0 5px 0 #2B2420;transform:rotate(1.5deg);font-size:12px;color:#2B2420}
.refshot .rs-h{font-weight:700;margin:0 2px 6px}
.refshot .rs-n{margin:6px 2px 0;color:#8A7A6C}
.rs-ph{position:relative;height:200px;border-radius:12px;background:#1B1530;padding:14px 10px;display:flex;flex-wrap:wrap;align-content:flex-start;gap:6px}
.rs-bar{display:block;width:100%;height:64px;border-radius:8px;background:linear-gradient(#2a2145,#1B1530);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.rs-chip{display:block;width:26px;height:14px;border-radius:7px}
.rs-chip[data-c="#2563EB"]{background:#2563EB}.rs-chip[data-c="#FF4D4F"]{background:#FF4D4F}.rs-chip[data-c="#FFC53D"]{background:#FFC53D}.rs-chip[data-c="#22C55E"]{background:#22C55E}
.rs-t{display:block;width:80%;height:8px;border-radius:4px;background:#fff;text-decoration:none}.rs-t.s2{width:55%;opacity:.85}
.canvas.eyedrop .refshot [data-c]{cursor:crosshair}
/* VI 里的值点一下就复制 */
.vi-tc{display:inline-flex;gap:6px}
.vi-pin .cp{position:relative;cursor:copy;padding:2px 6px;border-radius:6px;background:rgba(43,32,26,.06);transition:background .15s}
.vi-pin .cp:hover{background:rgba(255,197,61,.35)}
.vi-pin .cp.copied{animation:cp-pop .45s cubic-bezier(.3,1.6,.5,1)}
.vi-pin .cp.copied::after{content:"\5DF2\590D\5236";position:absolute;left:50%;bottom:100%;transform:translate(-50%,-4px);padding:2px 7px;border-radius:999px;background:#2B201A;color:#FFF8EC;font:600 11px/1.5 inherit;white-space:nowrap;pointer-events:none;animation:cp-tip .9s cubic-bezier(.3,1.6,.5,1) both}
@keyframes cp-pop{0%{transform:scale(1)}40%{transform:scale(1.18)}100%{transform:scale(1)}}
@keyframes cp-tip{0%{opacity:0;transform:translate(-50%,4px) scale(.6)}25%{opacity:1;transform:translate(-50%,-6px) scale(1.08)}40%{transform:translate(-50%,-4px) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-8px)}}
/* 从 VI 窗口拖出来 */
.vi-pin .vi-lg,.vi-pin .vi-c i{cursor:grab}
.vi-ghost{position:fixed;left:0;top:0;z-index:9999;pointer-events:none;opacity:0;margin:-24px 0 0 -24px;transition:opacity .12s,scale .2s cubic-bezier(.3,1.6,.5,1);scale:.8}
.vi-ghost.on{opacity:.9;scale:1}.vi-ghost.ok{scale:1.08}
.vi-ghost.col{width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.25),inset 0 0 0 2px #fff}
/* 地图上每稿用时 */
.dr{position:relative}
.dr-t{position:absolute;left:50%;top:100%;transform:translateX(-50%);margin-top:4px;font:600 10px/1 ui-monospace,Menlo,monospace;font-style:normal;color:var(--ink2);opacity:.75;white-space:nowrap;pointer-events:none}
.pg-tm{margin-left:10px;font:600 13px ui-monospace,Menlo,monospace;color:var(--ink2);opacity:.75}
/* ---- 小游戏统一外观：白卡片 HUD、按键提示条、开场演示卡 ---- */
.mg-hud{position:absolute;left:24px;top:20px;display:flex;align-items:center;gap:14px;background:#fff;border-radius:20px;padding:8px 20px 8px 8px;box-shadow:0 10px 30px rgba(0,0,0,.18);z-index:5}
.mg-av svg{display:block;border-radius:50%}
.mg-meter{display:flex;flex-direction:column;gap:6px;min-width:150px}
.mg-num{font-family:var(--display);font-size:20px;color:var(--ink2);line-height:1}
.mg-num b{font-size:34px;color:var(--ink);display:inline-block}
.mg-num.pop b{animation:mgpop .4s cubic-bezier(.3,1.8,.5,1)}
@keyframes mgpop{0%{transform:scale(1)}40%{transform:scale(1.45)}100%{transform:scale(1)}}
.mg-bar{height:10px;border-radius:5px;background:#F2F3F5;overflow:hidden}
.mg-bar i{display:block;height:100%;width:0;background:var(--ok);border-radius:5px;transition:width .35s cubic-bezier(.3,1.5,.5,1)}
.mg-keys{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);display:flex;gap:18px;background:rgba(255,255,255,.92);border-radius:999px;padding:10px 22px;box-shadow:0 10px 30px rgba(0,0,0,.15);font-size:16px;font-weight:700;color:var(--ink);white-space:nowrap;z-index:5}
.mg-keys span{display:flex;align-items:center;gap:6px}
.mg-keys kbd{font:inherit;font-size:13px;background:#F2F3F5;border:1px solid #E1E4E8;border-bottom-width:3px;border-radius:8px;padding:3px 9px;color:var(--ink2)}
.mg-how{position:absolute;inset:0;display:grid;place-items:center;background:rgba(18,20,30,.35);z-index:8;transition:opacity .3s}
.mg-how.out{opacity:0;pointer-events:none}
.mg-card{background:#fff;border-radius:24px;box-shadow:0 30px 80px rgba(0,0,0,.35);padding:28px 32px;width:min(560px,92vw);display:flex;flex-direction:column;gap:16px;animation:mgin .45s cubic-bezier(.3,1.5,.5,1)}
@keyframes mgin{from{transform:scale(.85) translateY(20px);opacity:0}}
.mg-go{font-size:24px;padding:14px 20px;border-radius:16px;align-self:stretch}
.hw-row{display:flex;align-items:center;gap:20px}
.hw-row p{margin:0;font-family:var(--display);font-size:24px;color:var(--ink)}
.hw-demo{position:relative;flex:none;width:150px;height:96px;border-radius:16px;background:linear-gradient(#BFD7EA,#E8EEF4);overflow:hidden}
.hw-hand{position:absolute;left:66px;width:22px;height:30px;border-radius:4px;background:#fff;box-shadow:0 0 0 2px #C98A1B,0 4px 8px rgba(0,0,0,.2)}
.hw-dodge .hw-hand{animation:hwbob 2.4s ease-in-out infinite}
.hw-bird{position:absolute;top:36px;left:0;animation:hwbird 2.4s linear infinite}
.hw-bird svg{width:34px}
@keyframes hwbob{0%,20%{top:33px}35%,75%{top:62px}90%,100%{top:33px}}
@keyframes hwbird{0%{transform:translateX(160px)}100%{transform:translateX(-50px)}}
.hw-stick .hw-hand{top:33px}
.hw-pole{position:absolute;top:0;bottom:0;width:8px;border-radius:3px;background:linear-gradient(90deg,#6B7480,#A5AEB8,#6B7480);animation:hwpole 2.4s linear infinite}
@keyframes hwpole{0%{left:150px}50%,60%{left:73px}100%{left:-20px}}
.hw-tap{position:absolute;left:62px;top:34px;width:30px;height:30px;border-radius:50%;border:3px solid var(--primary);opacity:0;animation:hwtap 2.4s ease-out infinite}
@keyframes hwtap{0%,48%{opacity:0;transform:scale(.3)}52%{opacity:1;transform:scale(.6)}70%{opacity:0;transform:scale(1.6)}100%{opacity:0}}
/* 贴启事 */
.mg.poster{background:linear-gradient(#BFD7EA,#E8EEF4 70%,#9AA3AD 70%,#8A939D)}
.mg.poster .pg-poles{position:absolute;left:0;right:0;top:8%;bottom:26%}
.mg.poster .pl-stick{position:absolute;left:-9px;top:0;bottom:-6%;width:18px}
.mg.poster .pl-slot{position:absolute;left:0;transform:translate(-50%,-50%);min-height:0;width:auto;display:block;filter:drop-shadow(0 4px 6px rgba(0,0,0,.2))}
.mg.poster .pg-hand{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);z-index:3;pointer-events:none;filter:drop-shadow(0 10px 18px rgba(0,0,0,.25))}
.mg.poster .pg-hand::after{display:none}
.pg-paw{position:absolute;left:50%;bottom:-16px;width:34px;height:26px;margin-left:-17px;border-radius:14px 14px 16px 16px;background:#F8D7B8;box-shadow:inset 0 -4px 0 rgba(0,0,0,.08)}
.pg-hand.empty .pg-pp{opacity:0}
.pg-hand.ouch{animation:pgouch .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes pgouch{0%{transform:translate(-50%,-50%)}20%{transform:translate(-50%,-50%) rotate(-16deg) scale(.9)}45%{transform:translate(-50%,-50%) rotate(12deg) scale(1.08)}70%{transform:translate(-50%,-50%) rotate(-5deg)}100%{transform:translate(-50%,-50%)}}
.pg-birds{position:absolute;inset:0;pointer-events:none;z-index:4}
.pg-bird{position:absolute;left:0;top:0;margin:-20px 0 0 -30px}
.pg-bird .bd-w1,.pg-bird .bd-w2{transform-origin:30px 21px;animation:bdflap .22s ease-in-out infinite alternate}
@keyframes bdflap{to{transform:scaleY(-.6)}}
.pg-bird.hit svg{animation:bdhit .6s ease-out forwards}
@keyframes bdhit{to{transform:translateY(-60px) rotate(-200deg);opacity:0}}
.pg-drop{position:absolute;transform:translate(-50%,-50%);z-index:4;pointer-events:none;animation:pgdrop .9s cubic-bezier(.4,0,.8,.6) forwards}
@keyframes pgdrop{to{transform:translate(-20%,55vh) rotate(160deg);opacity:.2}}
.pg-fth{position:absolute;width:10px;height:5px;border-radius:50%;background:#6B7280;z-index:4;pointer-events:none;animation:pgfth .8s ease-out forwards}
@keyframes pgfth{to{transform:translate(var(--dx),var(--dy)) rotate(var(--r));opacity:0}}
.pg-pop{position:absolute;transform:translate(-50%,-50%);font-family:var(--display);font-size:34px;z-index:6;pointer-events:none;animation:pgpop .9s cubic-bezier(.3,1.6,.5,1) forwards}
.pg-pop.ok{color:var(--ok)}.pg-pop.bad{color:var(--red)}
@keyframes pgpop{0%{transform:translate(-50%,-50%) scale(.4)}25%{transform:translate(-50%,-80%) scale(1.25)}100%{transform:translate(-50%,-160%) scale(1);opacity:0}}
.po-start{fill:none;stroke:#FFB020;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:postart 1.2s ease-in-out infinite}
@keyframes postart{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
.po-close{fill:rgba(255,176,32,.25);stroke:#FFB020;stroke-width:3;transform-box:fill-box;transform-origin:center;animation:poclose .5s cubic-bezier(.3,1.8,.5,1)}
@keyframes poclose{from{transform:scale(.4)}}
.pen-end{position:absolute;background:rgba(31,35,41,.78);color:#fff;font-size:11px;padding:2px 7px;border-radius:6px;white-space:nowrap;pointer-events:none;z-index:6}
.pen-end kbd{font:inherit;font-weight:700;background:rgba(255,255,255,.2);border-radius:3px;padding:0 4px}
.dr.skip .dr-dot{background:#FFF4D6;border-color:#F5B83D;color:#C98A1B;display:grid;place-items:center}
.dr-t.sk{color:#C98A1B;font:700 11px/1 "UI Sans",sans-serif;opacity:1}
.rs .m-btns .skip{color:var(--ink2)}
.pg-bird svg{width:84px;height:auto}.pg-bird{margin:-28px 0 0 -42px}
/* ---------- 声音设置（右下角） ---------- */
.snd{position:fixed;right:14px;bottom:14px;z-index:80}
.snd .mute{position:static}
.snd.open .mute{transform:translateY(2px);box-shadow:0 0 0 2px var(--ink),0 1px 0 var(--ink);background:var(--acc)}
.snd-pop{position:absolute;right:0;bottom:54px;width:292px;background:var(--paper);color:var(--cof);border-radius:18px;padding:16px 16px 12px;box-shadow:0 0 0 2.5px var(--ink),0 5px 0 var(--ink),0 18px 40px rgba(31,35,41,.25);transform-origin:100% 100%;animation:sp-in .28s var(--spring)}
.snd-pop[hidden]{display:none}
.snd-pop::after{content:"";position:absolute;right:15px;bottom:-9px;width:14px;height:14px;background:var(--paper);transform:rotate(45deg);box-shadow:2.5px 2.5px 0 0 var(--ink)}
@keyframes sp-in{from{opacity:0;transform:translateY(8px) scale(.92)}to{opacity:1;transform:none}}
.sp-h{font-family:var(--display);font-size:22px;line-height:1;margin:0 0 12px;color:var(--ink)}
.sp-row{background:#fff;border-radius:12px;padding:11px 12px 12px;box-shadow:0 0 0 2px var(--ink);margin-bottom:10px;transition:background .2s}
.sp-row.off{background:#F2EDE4}
.sp-top{display:flex;align-items:center;gap:8px}
.sp-top b{flex:1;font-size:15px;font-weight:700;color:var(--ink)}
.sp-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--acc);color:var(--ink);box-shadow:0 0 0 2px var(--ink)}
.sp-row.off .sp-ic{background:#E5DED2;color:var(--ink2)}
.sp-tg{width:46px;height:26px;border-radius:99px;border:0;padding:0;cursor:pointer;background:#D9D2C6;box-shadow:inset 0 0 0 2px var(--ink);position:relative;transition:background .2s}
.sp-tg i{position:absolute;left:4px;top:4px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px var(--ink);transition:transform .25s var(--spring)}
.sp-tg.on{background:var(--ok)}
.sp-tg.on i{transform:translateX(20px)}
.sp-tg:focus-visible,.snd-pop input:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.sp-sl{display:flex;align-items:center;gap:10px;margin-top:10px}
.sp-sl input{--p:50%;flex:1;-webkit-appearance:none;appearance:none;height:10px;border-radius:99px;background:linear-gradient(90deg,var(--acc) var(--p),#EFE7DA var(--p));box-shadow:inset 0 0 0 2px var(--ink);cursor:pointer;margin:0}
.sp-row.off .sp-sl input{background:linear-gradient(90deg,#CFC6B8 var(--p),#EFE7DA var(--p))}
.sp-sl input::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 0 0 2.5px var(--ink),0 2px 0 2.5px var(--ink);cursor:grab}
.sp-sl input::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:2.5px solid var(--ink);cursor:grab}
.sp-v{width:30px;text-align:right;font-variant-numeric:tabular-nums;font-size:13px;font-weight:700;color:var(--ink2)}
.sp-note{font-size:12px;color:var(--cof2);padding:0 2px}
@media (prefers-reduced-motion:reduce){.snd-pop{animation:none}}
/* 终局：每轮开打前的说明 + 3-2-1 */
.bi{position:fixed;inset:0;z-index:64;display:grid;place-items:center;background:rgba(43,32,26,.5);backdrop-filter:blur(5px);transition:opacity .25s;padding:16px}
.bi.out{opacity:0;pointer-events:none}
.bi-card{max-width:calc(100vw - 32px)}
.bi-say{display:flex;align-items:center;gap:10px;text-align:left;margin:10px 0 0;background:#F4F1EA;border-radius:14px;padding:8px 12px}
.bi-say p{margin:0;font-size:15px}
.bi-how{text-align:left;margin:14px 0 16px;font-size:15px;line-height:1.6}
.bi-how p{margin:0 0 6px}
.bi-wl{display:grid;gap:6px;margin-top:10px}
.bi-wl>div{display:flex;align-items:center;gap:8px;border-radius:12px;padding:7px 10px;font-size:14px}
.bi-wl i{display:grid;place-items:center;flex:none}
.bi-wl svg{width:18px;height:18px}
.bi-w{background:#E8F5EC;color:#1E6B3A}.bi-w svg{color:#2FA35A}
.bi-l{background:#FDECEC;color:#9B2C2C}.bi-l svg{fill:none;stroke:#D64545;stroke-width:2}
.lstart .ls-card{max-height:calc(100vh - 32px);overflow:auto}
.bi-cd{position:fixed;inset:0;z-index:90;display:grid;place-items:center;pointer-events:all;background:rgba(43,32,26,.25);transition:opacity .2s}
.bi-cd.out{opacity:0}
.bi-cd b{font-family:var(--display);font-weight:400;font-size:160px;color:#fff;-webkit-text-stroke:5px var(--ink);paint-order:stroke;text-shadow:0 10px 0 var(--ink)}
.bi-cd b.pop{animation:cdpop .75s cubic-bezier(.2,1.4,.4,1)}
@keyframes cdpop{0%{transform:scale(.3);opacity:0}30%{transform:scale(1.15);opacity:1}70%{transform:scale(1);opacity:1}100%{transform:scale(.9);opacity:0}}
/* 章节卡：换项目时 */
.chap{position:fixed;inset:0;z-index:95;display:grid;place-items:center;background:#FBF6EC;cursor:pointer;animation:chin .45s cubic-bezier(.2,.8,.2,1);transition:opacity .38s,transform .38s}
.chap.out{opacity:0;transform:scale(1.04)}
.chap.back{background:rgba(251,246,236,.9)}
.ch-in{text-align:center;color:var(--cof,#2B201A)}
.ch-k{display:inline-block;font-weight:700;font-size:14px;letter-spacing:.2em;background:var(--ink);color:#FFD43B;padding:5px 14px;border-radius:99px;transform:rotate(-2deg)}
.ch-por{margin:22px auto 14px;width:max-content}
.ch-por svg{display:block;border-radius:50%;box-shadow:0 0 0 3px #fff,0 0 0 6px var(--ink)}
.ch-t{font-family:var(--display);font-size:64px;line-height:1.1}
.chap.back .ch-t{font-size:44px}
.ch-s{font-size:18px;color:var(--ink2);margin-top:8px;min-height:1em}
@keyframes chin{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
.ch-in>*{animation:chup .6s cubic-bezier(.2,1.2,.4,1) both}
.ch-por{animation-delay:.08s}.ch-t{animation-delay:.16s}.ch-s{animation-delay:.24s}
@keyframes chup{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.chap,.ch-in>*{animation:none}}
.hud-lv .hud-pj{display:inline-flex;align-items:center;gap:6px;padding:2px 9px 2px 3px}
.hud-pj svg{display:block;border-radius:50%;box-shadow:0 0 0 1.5px #FFD43B}
.start .gtitle.huge{margin-bottom:64px}
/* 封面：剧情 / 自由接单 两个主按钮，一样大；鼠标在哪个上，选中框就跟到哪个 */
.st-btns{display:flex;flex-wrap:wrap;gap:30px;align-items:stretch}
.start .st-btns .start-go{min-width:250px;justify-content:center}
.start .start-free{flex-direction:column;gap:2px;background:#FFD43B;color:var(--ink)}
.start .start-free:hover{background:#FFDC5C}
.start .start-free small{font-family:var(--body,inherit);font-size:13px;letter-spacing:0;font-weight:700;opacity:.75}
.start .start-free.lock{background:#ECE7DC;color:#9A9286;cursor:not-allowed;box-shadow:0 5px 0 #B9B1A3}
.start .start-free.lock:hover{transform:none}
.start .st-btns .start-go::before,.start .st-btns .start-go .hd{opacity:0;transition:opacity .15s,inset .2s var(--ease),left .2s var(--ease),right .2s var(--ease),top .2s var(--ease),bottom .2s var(--ease)}
.start .st-btns:not(:hover):not(:focus-within) .start-go:first-child::before,.start .st-btns:not(:hover):not(:focus-within) .start-go:first-child .hd,
.start .st-btns .start-go:not(.lock):hover::before,.start .st-btns .start-go:not(.lock):hover .hd,.start .st-btns .start-go:focus-visible::before,.start .st-btns .start-go:focus-visible .hd{opacity:1}
@media (max-width:760px){.st-btns{gap:22px}.start .st-btns .start-go{min-width:0;flex:1}}
.seg.ff.fflist{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px}
.seg.ff.fflist button{display:flex;align-items:center;gap:6px;justify-content:flex-start;padding:6px 8px;height:auto;min-height:30px;text-align:left;font-size:12px;line-height:1.2}
.seg.ff.fflist button b{font-size:16px;font-weight:400;width:20px;text-align:center;flex:none}
.seg.ff.fflist button span{font-family:var(--font);font-size:11px;color:var(--ink2)}
.seg.ff.fflist button.on span{color:inherit}
.seg.ff.fflist button:first-child{grid-column:1/-1}
.hud-wallet{width:auto;min-width:150px}
.hud-wallet .hud-fv b{font-size:18px}
.fr-rows{list-style:none;margin:0 0 6px;padding:0;font-size:13px;color:var(--ink2)}
.fr-rows li{display:flex;justify-content:space-between;padding:2px 0}
/* 图形工具 */
.shp-wrap{position:relative;display:flex;align-items:center}
.shp-wrap .tool.shp{border-radius:6px 0 0 6px;width:30px}
.shp-dd{width:14px;height:32px;border:0;background:transparent;color:#bbb;border-radius:0 6px 6px 0;display:grid;place-items:center;padding:0}
.shp-dd:hover{background:rgba(255,255,255,.09);color:#fff}
.shp-menu{position:absolute;top:38px;left:0;z-index:60;background:#2C2C2C;border-radius:10px;padding:6px;box-shadow:0 10px 30px rgba(0,0,0,.35);min-width:168px;display:flex;flex-direction:column;gap:1px}
.shp-menu[hidden]{display:none}
.shp-menu button{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:#eee;padding:7px 10px;border-radius:6px;font-size:13px;text-align:left}
.shp-menu button svg{width:16px;height:16px}
.shp-menu button span{flex:1}
.shp-menu button kbd{font-family:var(--font);font-size:11px;color:#999;background:none;border:0}
.shp-menu button:hover{background:var(--blue);color:#fff}.shp-menu button:hover kbd{color:#dbeafe}
.shp-menu button.on:not(:hover){color:#7cc4ff}
.canvas.draw-mode,.canvas.draw-mode .node{cursor:crosshair}
.node.shape{background:transparent}
.node.shape.shp-line{overflow:visible}
.sh .nofill{margin-left:auto;border:0;background:none;color:var(--blue);font-size:11px;padding:0;cursor:pointer}
.seg.flip button,.seg.dist button{font-size:11px}
.txt-in textarea{width:100%;box-sizing:border-box;resize:vertical;border:1px solid var(--line);border-radius:6px;padding:6px 8px;font:inherit;font-size:13px;margin-top:6px}
.txt-in textarea:focus{outline:2px solid var(--blue);border-color:transparent}
.insp{padding-bottom:64px}
.rs-bill li.sub{border-top:1px dashed #DADCE0;margin-top:4px;padding-top:7px;color:var(--ink)}
.rs-bill li.sub b{font-weight:700}
.fr-rows li.dn b{color:var(--red)}
/* 作品集 */
.st-more{display:flex;align-items:center;gap:18px;margin-top:26px}
.st-more .st-note{margin-top:0}
.start-folio{display:inline-flex;align-items:baseline;gap:10px;border:0;cursor:pointer;background:#fff;color:var(--ink);font-family:var(--display);font-size:24px;letter-spacing:1px;padding:10px 22px 11px;border-radius:12px;box-shadow:0 0 0 2.5px var(--ink),0 5px 0 var(--ink);transition:transform .12s,box-shadow .12s}
.start-folio small{font-family:var(--font);font-size:13px;font-weight:700;letter-spacing:0;opacity:.55}
.start-folio:hover{transform:translateY(-2px);box-shadow:0 0 0 2.5px var(--ink),0 7px 0 var(--ink)}
.start-folio:active{transform:translateY(4px);box-shadow:0 0 0 2.5px var(--ink),0 1px 0 var(--ink)}
.folio{position:fixed;inset:0;z-index:80;background:rgba(31,35,41,.55);display:grid;place-items:center;padding:28px;animation:fo-in .22s var(--ease,ease-out)}
.folio.out{opacity:0;transition:opacity .2s}
@keyframes fo-in{from{opacity:0}}
.fo-in{width:min(1180px,100%);height:min(820px,100%);background:#FBF8F1;border-radius:22px;box-shadow:0 0 0 3px var(--ink),0 10px 0 var(--ink),0 40px 80px rgba(0,0,0,.35);display:flex;flex-direction:column;overflow:hidden}
.fo-top{display:flex;align-items:center;gap:28px;padding:22px 28px 18px;border-bottom:2px dashed #E3DDD0}
.fo-h{font-family:var(--display);font-size:40px;letter-spacing:2px;color:var(--ink)}
.fo-tabs{display:flex;gap:6px;background:#EFEADF;border-radius:12px;padding:4px}
.fo-tabs button{border:0;background:none;font-size:16px;font-weight:700;color:#7A7368;padding:8px 18px;border-radius:9px;cursor:pointer}
.fo-tabs button i{font-style:normal;font-size:12px;opacity:.7;margin-left:2px}
.fo-tabs button.on{background:#fff;color:var(--ink);box-shadow:0 1px 0 #D8D1C2,0 2px 6px rgba(0,0,0,.06)}
.fo-x{margin-left:auto;width:40px;height:40px;border-radius:50%;border:0;background:#EFEADF;font-size:16px;cursor:pointer;color:var(--ink)}
.fo-x:hover{background:#E5DFD2}
.fo-grid{flex:1;overflow:auto;padding:24px 28px 32px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px;align-content:start}
.fo-card{border:0;background:#fff;border-radius:16px;padding:12px;text-align:left;cursor:pointer;box-shadow:0 0 0 2px var(--ink),0 5px 0 var(--ink);transition:transform .15s var(--ease,ease-out),box-shadow .15s;display:flex;flex-direction:column;gap:12px}
.fo-card:hover{transform:translateY(-3px) rotate(-.4deg);box-shadow:0 0 0 2px var(--ink),0 8px 0 var(--ink)}
.fo-card:active{transform:translateY(3px);box-shadow:0 0 0 2px var(--ink),0 2px 0 var(--ink)}
.fo-th{height:176px;border-radius:10px;background:#F2EFE8 radial-gradient(#DDD6C8 1px,transparent 1px) 0 0/14px 14px;display:grid;place-items:center;overflow:hidden}
.fo-art{position:relative;flex:none}
.fo-art .artboard{position:absolute;left:0;top:0;pointer-events:none}
.fo-art .artboard *{animation:none!important;transition:none!important}
.fo-art.phone .artboard{border-radius:40px;overflow:hidden}
.fo-meta{display:flex;flex-direction:column;gap:3px;padding:0 4px 2px;position:relative}
.fo-meta b{font-size:16px;color:var(--ink)}
.fo-meta span{font-size:12.5px;color:#7A7368}
.fo-meta em{position:absolute;right:4px;top:0;font-style:normal;font-weight:800;color:#14AE5C;font-size:14px}
.fo-none{font-size:14px;color:#9A9286}
.fo-empty{grid-column:1/-1;text-align:center;padding:90px 0;color:#9A9286;font-size:18px}
.fo-bigm .m-card{width:min(1120px,96vw);padding:26px}
.fo-big{display:flex;gap:28px;align-items:center}
.fo-bart{flex:1;min-height:60vh;border-radius:14px;background:#F2EFE8 radial-gradient(#DDD6C8 1px,transparent 1px) 0 0/16px 16px;display:grid;place-items:center;padding:20px;overflow:hidden}
.fo-bside{width:250px;display:flex;flex-direction:column;gap:12px;text-align:left}
.fo-btag{font-size:12px;font-weight:700;color:#7A7368}
.fo-bt{font-family:var(--display);font-size:30px;line-height:1.15;color:var(--ink)}
.fo-bwho{display:flex;gap:10px;align-items:center}.fo-bwho span{display:flex;flex-direction:column;font-size:12.5px;color:#7A7368}.fo-bwho b{font-size:15px;color:var(--ink)}
.fo-bside dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:6px 0;font-size:14px}
.fo-bside dt{color:#9A9286}.fo-bside dd{margin:0;color:var(--ink);font-variant-numeric:tabular-nums}
.fo-bside .m-btns{margin-top:8px;justify-content:flex-start}
.btn.danger{background:var(--red);color:#fff}
.fo-ask{z-index:95}
@media (max-width:760px){.fo-big{flex-direction:column}.fo-bside{width:100%}.fo-h{font-size:30px}.fo-top{gap:14px;flex-wrap:wrap}}
.modal.fo-bigm{z-index:90}.modal.fo-ask{z-index:95}
.pg-pt{font-size:.62em;letter-spacing:1px;color:var(--ink-2,#6b5d52)}
.ch-k:empty{display:none}

/* 挑毛病 v2：屏幕 300 宽，右边 60 是屏幕外 */
.fl-stage{overflow:hidden}
.fl-stage .ai-scr{position:absolute;left:0;top:0;right:auto;bottom:auto;width:300px;height:640px;box-sizing:border-box;border:3px solid var(--cof);border-radius:22px;overflow:hidden;background:linear-gradient(#F7F0FF,#fff);box-shadow:none}
.fl-stage .ai-bar{height:44px;border-radius:0}
.fl-stage .ai-price{position:absolute;left:18px;top:150px;font:900 32px/1 var(--display);color:#9747FF}
.fl-stage .ai-ttl{position:absolute;left:16px;top:62px;width:170px;height:44px;border:2px dashed #B9A6EE;border-radius:8px;white-space:nowrap;font-size:24px;font-weight:800;line-height:40px;padding-left:8px;box-sizing:border-box;color:var(--ink,#1F2329)}
.fl-stage .ai-hand{position:absolute;left:146px;top:120px}
.fl-stage .ai-hand svg{display:block;border-radius:14px}
.fl-stage .ai-fs{position:absolute;left:14px;top:280px;width:276px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px}
.fl-stage .ai-fs span{background:#FFE7F0;color:#D6336C;border-radius:6px;padding:1px 6px;line-height:1.15}
.fl-stage .ai-row{position:absolute;left:0;top:432px;width:360px;height:76px}
.fl-stage .ai-row i{position:absolute;top:0;width:62px;height:76px;border-radius:12px;background:#E6DAFF;display:grid;place-items:center;font-style:normal;font:900 24px/1 var(--display);color:var(--purple);box-shadow:0 0 0 2px #CDBBF7}
.fl-stage .ai-buy{position:absolute;left:16px;top:544px;width:268px;height:19px;padding:0;justify-content:center;border-radius:6px;background:var(--purple);color:#fff;overflow:hidden;display:flex;align-items:center}
.fl-stage .ai-buy b{display:block;flex:none;width:max-content;max-width:none;margin:0;padding:0;background:none;box-shadow:none;border:0;color:#fff;font-size:26px;font-weight:800;height:40px;line-height:40px;white-space:nowrap;text-align:center}
.fl-hit.miss{border:3px dashed #E03131;background:rgba(224,49,49,.08);border-radius:50%;animation:chpop .35s var(--spring)}
.fl-hit.miss em{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);white-space:nowrap;background:#E03131;color:#fff;font-style:normal;font-weight:800;font-size:15px;padding:5px 12px;border-radius:10px;box-shadow:0 4px 10px rgba(0,0,0,.2)}
.fl-hit[data-f=off] em{left:auto!important;right:4px;transform:translateY(-100%)!important}
.fl-hit.miss[data-f=off] em{top:50%;transform:translateY(-50%)!important;right:8px}

/* ---------- 检查器：8px 网格。所有分区同样的内边距、行距、控件高度 ---------- */
.insp .sec{display:flex;flex-direction:column;gap:8px;padding:16px;border-bottom:1px solid #EEF0F3}
.insp .sec.head{flex-direction:row;align-items:center;padding:16px}
.insp .sec>*{margin:0!important}
.insp .sh{height:16px;margin:0;font-size:11px;line-height:16px;white-space:nowrap}
.insp .sh.sub{margin-top:8px!important}
.insp .grid2{gap:8px}
.insp .nf,.insp .hexrow,.insp .add-al{height:32px;box-sizing:border-box}
.insp .seg{height:32px;box-sizing:border-box;padding:2px;border-radius:8px}
.insp .seg button{height:28px;white-space:nowrap}
.insp .nf-l{white-space:nowrap;overflow:hidden}
.insp .note{margin:0}
.insp .ts-row{display:flex;gap:8px;height:32px}
.insp .ts-row select,.insp .ts-row .ts-on{flex:1;min-width:0;height:32px;box-sizing:border-box;border:1px solid transparent;border-radius:6px;background:#F2F3F5;font:inherit;font-size:12px;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.insp .ts-row .ts-on{display:flex;align-items:center;gap:8px}
.insp .ts-row button{flex:none;width:32px;height:32px;box-sizing:border-box;border:1px dashed #C9CDD4;background:#fff;border-radius:6px;font-size:14px;color:#555}
/* 下拉 */
.dd{position:relative;height:32px;min-width:0}
.dd>.seg{position:absolute;left:0;right:0;top:0;display:flex!important;flex-direction:column;gap:2px;height:auto!important;padding:2px;margin:0;background:#F2F3F5;border:1px solid transparent;border-radius:6px;z-index:5}
.dd>.seg button{flex:none;width:100%;height:26px;justify-content:flex-start;padding:0 24px 0 8px;font-size:12px;color:#1E1E1E;border-radius:4px;box-shadow:none!important;background:transparent;white-space:nowrap;overflow:hidden}
.dd>.seg button span{overflow:hidden;text-overflow:ellipsis;font-family:inherit;font-size:12px;color:inherit}
.dd:not(.open)>.seg button:not(.on){display:none}
.dd:not(.open):not(:has(button.on))>.seg button:first-child{display:flex;color:#999}
.dd:not(.open)>.seg button.on{background:transparent}
.dd::after{content:"";position:absolute;right:10px;top:13px;width:6px;height:6px;border-right:1.5px solid #8C8C8C;border-bottom:1.5px solid #8C8C8C;transform:rotate(45deg);pointer-events:none;z-index:6}
.dd:hover>.seg{border-color:#E1E3E8}
.dd.open::after{display:none}
.dd.open>.seg{background:#fff;border-color:#E1E3E8;box-shadow:0 8px 24px rgba(0,0,0,.14);padding:4px;z-index:30}
.dd.open>.seg button:hover{background:#F2F3F5}
.dd.open>.seg button.on{background:#E8F3FF;color:var(--blue)}
.ffdd .seg button{font-size:13px}
.ffdd .seg button span{font-size:13px}
.insp .dd>.seg.fflist button,.insp .dd>.seg button{height:26px;min-height:0;padding:0 24px 0 8px;line-height:26px;gap:0}
.insp .dd>.seg.fflist button span{font-family:inherit;font-size:13px;color:inherit}

/* ---------- 封面动起来：选框像在拖角缩放、字在蹦、便利贴在晃 ---------- */
.start .gsel{transform-origin:0 100%;animation:gresize 3.2s cubic-bezier(.34,1.56,.64,1) infinite}
@keyframes gresize{0%,14%,100%{scale:1}28%{scale:1.16 1.12}42%{scale:.95 .96}52%{scale:1.04 1.03}62%,88%{scale:1}}
.start .gt-a i{animation:hopw 3s var(--ease) infinite;animation-delay:calc(var(--d,0) * 120ms)}
@keyframes hopw{0%,55%,100%{translate:0 0;rotate:0deg;scale:1}64%{translate:0 -18px;rotate:-7deg;scale:1.06}74%{translate:0 0;rotate:3deg;scale:1.1 .88}84%{rotate:-2deg;scale:1}92%{rotate:0deg}}
.start .st-sticky{animation:sway 4.2s ease-in-out infinite}
.start .st-sticky.s2{animation-duration:3.8s;animation-delay:-1.4s}
.start .st-sticky.s3{animation-duration:4.6s;animation-delay:-2.6s}
@keyframes sway{0%,100%{translate:0 0;rotate:-3deg}50%{translate:0 -12px;rotate:4deg}}
.start .st-frame{animation:fresize 3.6s cubic-bezier(.34,1.56,.64,1) infinite;animation-delay:-1.2s}
@keyframes fresize{0%,20%,100%{scale:1}34%{scale:1.1 1.07}48%{scale:.97}58%,88%{scale:1}}
.start .st-board{animation:bfloat 4.8s ease-in-out infinite}
@keyframes bfloat{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -12px;rotate:-1deg}}
/* 减少动态效果：不关掉，只是慢一点、轻一点（盖过全局那条 !important） */
@media (prefers-reduced-motion:reduce){
.start .gsel{animation:gsoft 6s ease-in-out infinite!important}
.start .gt-a i{animation:tsoft 6s ease-in-out infinite!important;animation-delay:calc(var(--d,0) * 200ms)!important}
.start .st-sticky,.start .st-board{animation:ssoft 8s ease-in-out infinite!important}
.start .st-frame{animation:gsoft 7s ease-in-out infinite!important}
}
@keyframes gsoft{0%,100%{scale:1}50%{scale:1.05 1.04}}
@keyframes tsoft{0%,100%{translate:0 0}50%{translate:0 -5px}}
@keyframes ssoft{0%,100%{translate:0 0;rotate:-1deg}50%{translate:0 -5px;rotate:1.5deg}}
