/* ============================================================
   润百颜 · 内容生产平台 · Demo B2 Shared Styles (Botanical Lab)
   1:1 复刻 v3 原网页所有 affordance,只换 B2 视觉皮
   ============================================================ */
:root{
  --canvas:#F7F7F2; --sage:#EFEEEA; --paper:#FFFFFF; --paper-d:#FBFBF7;
  --ink:#1F2D26; --ink2:#3E5147; --ink3:#7A8B83; --ink4:#B3BFB8; --ink5:#D8DDD2;
  --hair:#DCDFD7; --hair2:#C8CDC0; --hair3:#E6E8E0;
  --moss:#5B7560; --moss-d:#3D5240; --moss-l:#E7EBE1; --moss-line:rgba(91,117,96,.25);
  --bronze:#8B6F47; --bronze-d:#6E5638; --bronze-l:rgba(139,111,71,.13);
  --clay:#A85F4A; --clay-d:#854130; --clay-l:rgba(168,95,74,.14);
  --slate:#5C7892; --slate-l:rgba(92,120,146,.13);
  --plum:#7E6996; --plum-l:rgba(126,105,150,.12);
  --grade-s:#1F2D26; --grade-a:#5B7560; --grade-b:#8B6F47; --grade-c:#9DA7A0;
  --dim-emotion:#B8676E; --dim-node:#C28850; --dim-scene:#5B7560;
  --dim-ingredient:#5C7892; --dim-crowd:#7E6996; --dim-rival:#7A8590;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --serif:'EB Garamond','Source Han Serif SC',Georgia,'Songti SC',serif;
  --mono:'JetBrains Mono',ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --r-sm:8px; --r-md:14px; --r-lg:18px; --r-pill:999px;
  --h-ticker:46px; --h-top:66px; --h-stat:32px; --w-side:220px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--canvas);color:var(--ink);
  -webkit-font-smoothing:antialiased;letter-spacing:-.005em;line-height:1.6;font-weight:400;
  padding-top:calc(var(--h-ticker) + var(--h-top));padding-left:var(--w-side);padding-bottom:var(--h-stat);
  background-image:
    linear-gradient(rgba(91,117,96,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(91,117,96,.04) 1px,transparent 1px),
    radial-gradient(circle at 14% 8%,rgba(91,117,96,.05),transparent 38%),
    radial-gradient(circle at 88% 92%,rgba(139,111,71,.035),transparent 44%);
  background-size:44px 44px,44px 44px,100% 100%,100% 100%;background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.38;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' seed='5'/><feColorMatrix values='0 0 0 0 0.12  0 0 0 0 0.18  0 0 0 0 0.15  0 0 0 0.05 0'/></filter><rect width='220' height='220' filter='url(%23n)'/></svg>")}
::selection{background:rgba(91,117,96,.22)}
::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:var(--hair2);border-radius:8px;border:2px solid var(--canvas)}
@keyframes pulse{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes sweep{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes fillbar{from{width:0}}
@keyframes tickup{0%{transform:translateY(8px);opacity:0}30%{opacity:1}100%{transform:translateY(0);opacity:1}}
@keyframes ringfill{from{stroke-dashoffset:283}}
@keyframes wave{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
@keyframes pvscroll{to{transform:translateY(-50%)}}
@keyframes plwork{0%{left:2%;opacity:0}8%{opacity:1}92%{opacity:1}100%{left:98%;opacity:0}}
@keyframes npopin{from{opacity:0;transform:translateX(-50%) translateY(8px) scale(.92)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ===== ticker ===== */
#ticker{position:fixed;top:0;left:0;right:0;z-index:60;background:#0F1A15;color:#B7C7BC;
  height:var(--h-ticker);overflow:hidden;display:flex;align-items:center;border-bottom:1px solid #243029;
  font:500 12px/1 var(--mono);letter-spacing:.04em}
#ticker .tlab{flex:none;padding:0 18px;border-right:1px solid #243029;color:var(--moss-l);background:#172520;
  height:100%;display:flex;align-items:center;font-weight:600;letter-spacing:.14em;gap:9px}
#ticker .tlab .dot{width:6px;height:6px;border-radius:50%;background:#9CC9A7;animation:blink 1.6s infinite;box-shadow:0 0 0 3px rgba(156,201,167,.18)}
#ticker .tlab b{color:#D8B98A;font-weight:600;font-size:13px}
#ticker .twin{overflow:hidden;flex:1;position:relative;mask:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);padding:0 8px}
#ticker .trun{display:flex;gap:42px;white-space:nowrap;padding-left:28px;animation:ticker 70s linear infinite;width:max-content;align-items:center}
#ticker .ti{display:flex;align-items:center;gap:11px;font-size:12px}
#ticker .ti .dt{color:#7E9085;opacity:.7;font-weight:600;letter-spacing:.06em}
#ticker .ti .up{color:#9CC9A7;font-weight:600}
#ticker .ti .dn{color:#D08A78;font-weight:600}
#ticker .ti .pl{color:#D8B98A;font-weight:600;background:rgba(216,185,138,.13);padding:3px 7px;border-radius:4px;letter-spacing:.08em}
#ticker .ti .ng{color:#8BAFB0;font-weight:600;background:rgba(139,175,176,.13);padding:3px 7px;border-radius:4px;letter-spacing:.08em}
#ticker .clock{flex:none;padding:0 18px;border-left:1px solid #243029;color:#D8B98A;background:#172520;
  height:100%;display:flex;align-items:center;gap:12px;font-weight:600;letter-spacing:.1em;font-size:13px}
#ticker .clock .lab{color:#7E9085;font-size:10px;letter-spacing:.18em}
#ticker .clock .dot{width:5px;height:5px;border-radius:50%;background:#D8B98A;animation:blink 1.6s infinite}

/* ===== topbar ===== */
#topbar{position:fixed;top:var(--h-ticker);left:0;right:0;z-index:55;display:flex;align-items:center;gap:24px;
  height:var(--h-top);padding:0 32px 0 28px;background:rgba(247,247,242,.94);backdrop-filter:blur(18px);border-bottom:1px solid var(--hair)}
.crumb{display:flex;align-items:center;gap:10px;font:500 11px/1 var(--mono);color:var(--ink3);letter-spacing:.04em}
.crumb .sep{color:var(--ink4)}
.crumb .role{color:var(--ink2);font-weight:600}
.crumb .now{color:var(--moss);font-weight:600;font-size:11.5px}
.crumb .now::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--moss);margin-right:7px;vertical-align:middle;animation:blink 1.6s infinite}
#stepper{display:flex;align-items:center;gap:0;margin-left:auto}
#stepper .lbl{font:600 9.5px/1 var(--mono);letter-spacing:.18em;color:var(--ink4);margin-right:14px;text-transform:uppercase}
.step{display:flex;align-items:center;gap:9px;background:none;border:0;cursor:pointer;padding:8px 14px;border-radius:var(--r-pill);font-family:var(--sans);font-size:12.5px;color:var(--ink3);transition:.2s;font-weight:500}
.step .n{font-family:var(--mono);font-size:10.5px;color:var(--ink4);letter-spacing:.06em;font-weight:500}
.step.on{color:var(--ink);background:var(--paper);box-shadow:inset 0 0 0 1px var(--moss)}
.step.on .n{color:var(--moss);font-weight:600}
.step.on::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--moss);animation:blink 1.6s infinite;margin-right:2px}
.step.dim{color:var(--ink4)}
.step.dim .n{color:var(--ink5)}
.scon{width:14px;height:1px;background:var(--hair2)}
.tr{display:flex;align-items:center;gap:14px;white-space:nowrap;margin-left:18px}
#roleSel{display:flex;background:var(--paper);border:1px solid var(--hair);border-radius:var(--r-pill);padding:3px}
#roleSel .role{border:0;background:none;cursor:pointer;font-family:var(--sans);font-size:11.5px;color:var(--ink3);padding:6px 12px;border-radius:var(--r-pill);transition:.16s;font-weight:500}
#roleSel .role.on{background:var(--moss);color:var(--paper)}

/* ===== sidebar ===== */
#sidebar{position:fixed;left:0;top:calc(var(--h-ticker) + var(--h-top));bottom:var(--h-stat);width:var(--w-side);background:linear-gradient(180deg,var(--paper) 0%,var(--paper-d) 100%);border-right:1px solid var(--hair);z-index:45;display:flex;flex-direction:column;padding:24px 0 20px;overflow-y:auto}
.sb-brand{padding:0 22px 22px;margin-bottom:6px;border-bottom:1px solid var(--hair);display:flex;align-items:center;gap:11px}
.sb-brand .lf{width:34px;height:34px;border:1.2px solid var(--moss);border-radius:50%;display:grid;place-items:center;color:var(--moss);position:relative;flex:none}
.sb-brand .lf::before{content:"";width:9px;height:15px;background:var(--moss);border-radius:50% 50% 50% 50%/60% 60% 40% 40%;transform:rotate(-12deg)}
.sb-brand .nm{display:flex;flex-direction:column;gap:3px}
.sb-brand .nm .t{font-family:var(--serif);font-size:18px;font-weight:500;letter-spacing:-.01em;color:var(--ink);line-height:1}
.sb-brand .nm .s{font:600 9px/1 var(--mono);letter-spacing:.16em;color:var(--ink3);text-transform:uppercase}
.sb-sec{padding:18px 0 10px}
.sb-sec .sb-st{padding:0 22px 10px;display:flex;align-items:center;gap:7px;font:600 9.5px/1 var(--mono);letter-spacing:.16em;color:var(--moss);text-transform:uppercase}
.sb-sec .sb-st::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--moss)}
.sb-sec .sb-st .delta{margin-left:auto;color:var(--ink3);letter-spacing:.04em;font-weight:500}
.sb-page{padding:0 14px;display:flex;flex-direction:column;gap:2px}
.sb-page .sb-pg{display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:9px;color:var(--ink2);font-size:12.5px;font-weight:500;cursor:pointer;transition:.15s;text-decoration:none}
.sb-page .sb-pg:hover{background:var(--paper-d);color:var(--ink)}
.sb-page .sb-pg.on{background:var(--moss-l);color:var(--moss-d);font-weight:600}
.sb-page .sb-pg.on .pgn{color:var(--moss);font-weight:700}
.sb-page .sb-pg .pgn{font:600 9.5px/1 var(--mono);letter-spacing:.05em;color:var(--ink4);min-width:18px}
.sb-page .sb-pg.dim{color:var(--ink4);cursor:default}
.sb-page .sb-pg.dim:hover{background:transparent}
.sb-page .sb-pg.dim .pgn{color:var(--ink5)}
.sb-page .sb-pg .soon{margin-left:auto;font:600 9px/1 var(--mono);color:var(--ink4);letter-spacing:.1em}
.sb-anchors{margin-top:6px;padding:6px 14px 12px;display:flex;flex-direction:column;gap:1px}
.sb-anchors .sb-a{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 30px;border-radius:8px;font-size:12px;color:var(--ink3);font-weight:500;cursor:pointer;transition:.15s;text-decoration:none;position:relative}
.sb-anchors .sb-a::before{content:"";position:absolute;left:18px;top:50%;width:5px;height:1px;background:var(--hair2);transform:translateY(-50%)}
.sb-anchors .sb-a:hover{color:var(--ink);background:var(--paper-d)}
.sb-anchors .sb-a.on{color:var(--moss-d);background:var(--moss-l);font-weight:600}
.sb-anchors .sb-a.on::before{background:var(--moss);width:9px;height:2px;border-radius:2px}
.sb-anchors .sb-a .num{font:600 9.5px/1 var(--mono);letter-spacing:.06em;color:var(--ink4)}
.sb-anchors .sb-a.on .num{color:var(--moss)}
.sb-anchors .sb-a .cnt{margin-left:auto;font:500 10px/1 var(--mono);color:var(--ink4)}
.sb-anchors .sb-a.on .cnt{color:var(--moss);font-weight:600}
.sb-foot{margin-top:auto;padding:18px 22px 0;border-top:1px solid var(--hair);display:flex;flex-direction:column;gap:8px}
.sb-foot .row{display:flex;justify-content:space-between;font:500 10px/1 var(--mono);color:var(--ink3);letter-spacing:.06em}
.sb-foot .row .v{color:var(--ink2);font-weight:600}
.sb-foot .row.bld{color:var(--bronze);font-weight:600;letter-spacing:.12em}

/* ===== stage / hero / layer ===== */
#stage{position:relative;z-index:1;max-width:1320px;margin:0 auto;padding:34px 36px 80px}
.hero{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:flex-end;padding-bottom:36px;margin-bottom:8px;border-bottom:1px solid var(--hair);position:relative}
.hero::after{content:"";position:absolute;right:0;bottom:-1px;width:160px;height:2px;background:linear-gradient(90deg,var(--moss),var(--bronze))}
.eyebrow{font:600 10.5px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--moss);margin-bottom:18px;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--moss);box-shadow:0 0 0 3px var(--moss-l)}
.eyebrow .delta{margin-left:auto;color:var(--ink3);font-weight:500;letter-spacing:.04em;text-transform:none;font-size:10.5px}
.eyebrow .delta b{color:var(--clay);font-weight:600}
.hero h1{font-family:var(--serif);font-size:clamp(40px,4.6vw,58px);font-weight:500;letter-spacing:-.018em;line-height:1;color:var(--ink)}
.hero h1 em{font-style:italic;color:var(--moss);font-weight:500}
.hero p{color:var(--ink2);font-size:13.5px;max-width:640px;margin-top:18px;line-height:1.75}
.hero .meta-row{margin-top:22px;display:flex;align-items:center;gap:24px;font:500 10.5px/1 var(--mono);color:var(--ink3);letter-spacing:.06em;flex-wrap:wrap}
.hero .meta-row span{display:flex;align-items:center;gap:7px}
.hero .meta-row .lab{color:var(--ink4)}
.hero .meta-row b{color:var(--ink);font-weight:600;font-family:var(--mono)}
.hero .meta-row b.s{color:var(--grade-s)} .hero .meta-row b.a{color:var(--grade-a)} .hero .meta-row b.b{color:var(--grade-b)}
.hero .meta-row .pulse{width:6px;height:6px;border-radius:50%;background:var(--moss);animation:blink 1.6s infinite}
.hero .out{display:flex;flex-direction:column;gap:14px;background:var(--paper);border:1px solid var(--hair);border-radius:var(--r-md);padding:18px 22px;min-width:240px}
.hero .out .o-l{font:600 9.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink4)}
.hero .out .o-v{font-size:14px;font-weight:500;color:var(--ink);display:flex;align-items:center;gap:9px}
.hero .out .o-v .arr{color:var(--bronze);font-family:var(--mono);font-weight:600}

.layer{margin-top:60px;position:relative;scroll-margin-top:130px}
.layer::before{content:"";position:absolute;left:-26px;top:14px;bottom:0;width:1px;background:var(--hair);opacity:.7}
.layer::after{content:"";position:absolute;left:-30px;top:14px;width:9px;height:9px;border-radius:50%;background:var(--paper);border:1.5px solid var(--moss)}
.layer-h{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:18px;margin-bottom:28px}
.layer-h .lno{font:600 10.5px/1 var(--mono);letter-spacing:.2em;color:var(--moss);display:flex;align-items:center;gap:9px}
.layer-h .lno::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--moss);box-shadow:0 0 0 3px var(--moss-l)}
.layer-h h2{font-family:var(--serif);font-size:36px;font-weight:500;letter-spacing:-.015em;color:var(--ink);line-height:1.05;grid-column:1/-1}
.layer-h h2 em{font-style:italic;color:var(--moss);font-weight:500}
.layer-h .lstat{display:flex;align-items:center;gap:14px;font:500 10.5px/1 var(--mono);color:var(--ink3);letter-spacing:.08em;text-transform:uppercase}
.layer-h .lstat .ok{color:var(--moss);display:flex;align-items:center;gap:5px;font-weight:600}
.layer-h .lstat .ok::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--moss);animation:blink 1.6s infinite}
.layer-h .lstat .sep{color:var(--ink5)}
.layer-h .lstat b{color:var(--ink2);font-weight:600}
.layer-h .lmeta{grid-column:1/-1;font:400 12px/1.55 var(--sans);color:var(--ink3);font-style:italic;margin-top:4px}

/* ===== btn / badge / chip ===== */
.btn{display:inline-flex;align-items:center;gap:9px;border:0;cursor:pointer;font-family:var(--sans);font-size:13px;font-weight:500;padding:12px 22px;border-radius:var(--r-pill);transition:.16s;letter-spacing:-.005em}
.btn.primary{background:var(--moss);color:var(--paper)} .btn.primary:hover{background:var(--moss-d)}
.btn.primary .arr{font-family:var(--mono);font-weight:600}
.btn.ghost{background:transparent;border:1px solid var(--hair2);color:var(--ink)} .btn.ghost:hover{border-color:var(--moss);color:var(--moss)}
.btn.sm{padding:7px 14px;font-size:11.5px}
.btn.lg{padding:16px 36px;font-size:14.5px;font-weight:600}
.badge{display:inline-flex;align-items:center;gap:5px;font:600 9.5px/1 var(--mono);padding:4px 8px;border-radius:5px;letter-spacing:.06em}
.badge.b-grn,.badge.b-ok{color:var(--moss);background:var(--moss-l)}
.badge.b-wrn{color:var(--clay);background:var(--clay-l)}
.badge.b-wait{color:var(--ink3);background:var(--sage);border:1px solid var(--hair)}
.badge.b-tag{color:var(--ink2);background:var(--sage);border:1px solid var(--hair)}
.badge.b-int{color:var(--moss);background:var(--moss-l)}
.badge.b-ext{color:var(--slate);background:var(--slate-l)}
.badge.b-vid{color:var(--moss);background:var(--moss-l)}
.badge.b-img{color:var(--bronze);background:var(--bronze-l)}
.badge.b-bz{color:var(--bronze);background:var(--bronze-l)}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink2);background:var(--paper);border:1px solid var(--hair);padding:6px 12px;border-radius:var(--r-pill);cursor:pointer;transition:.15s;font-weight:500}
.chip:hover{border-color:var(--moss);color:var(--moss)}
.chip.on{background:var(--moss);color:var(--paper);border-color:var(--moss)}
.chip .id{font:600 9px/1 var(--mono);opacity:.55;letter-spacing:.04em}
.chip.dot::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cc,var(--ink3));margin-right:2px}
.chip.add{border-style:dashed;color:var(--ink3)}
.chip.add:hover{color:var(--moss);border-color:var(--moss);background:var(--moss-l)}

/* ===== statusbar / footer ===== */
#statusbar{position:fixed;left:0;right:0;bottom:0;z-index:48;height:var(--h-stat);background:#0F1A15;color:#B7C7BC;display:flex;align-items:center;padding:0 24px;font:500 11px/1 var(--mono);letter-spacing:.05em;border-top:1px solid #243029}
#statusbar .sb-l,#statusbar .sb-c,#statusbar .sb-r{display:flex;align-items:center;gap:18px}
#statusbar .sb-c{margin:0 auto} #statusbar .sb-r{margin-left:auto}
#statusbar .seg{display:flex;align-items:center;gap:7px}
#statusbar .seg .lab{color:#7E9085;letter-spacing:.12em;text-transform:uppercase;font-weight:600;font-size:10px}
#statusbar .seg .v{color:#E7EBE1;font-weight:500}
#statusbar .seg .vg{color:#9CC9A7;font-weight:600}
#statusbar .seg .vc{color:#D8B98A;font-weight:600}
#statusbar .seg .vw{color:#D08A78;font-weight:600}
#statusbar .seg .sep{color:#3D5240;margin:0 6px}
#statusbar .pulse{width:5px;height:5px;border-radius:50%;background:#9CC9A7;animation:blink 1.4s infinite}
footer{margin-top:64px;padding-top:30px;border-top:1px solid var(--hair);display:flex;justify-content:space-between;align-items:center;color:var(--ink3);font-size:11px}
footer .sig{font-family:var(--serif);font-size:16px;color:var(--moss-d);font-weight:500;font-style:italic}
footer .meta{font:600 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--moss)}

/* ====================================================
   科学传播组件
   ==================================================== */
.wiki{display:grid;grid-template-columns:240px minmax(0,1fr);gap:18px}
.wnav{display:flex;flex-direction:column;gap:18px}
.wg .wgt{font:600 9.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--bronze);margin-bottom:10px;padding-left:4px;display:flex;align-items:center;gap:7px}
.wg .wgt::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--bronze)}
.witem{display:flex;align-items:center;justify-content:space-between;width:100%;text-align:left;background:var(--paper);border:1px solid var(--hair);color:var(--ink2);font-family:var(--sans);font-size:13px;padding:11px 14px;border-radius:var(--r-sm);cursor:pointer;transition:.15s;margin-bottom:6px;font-weight:500}
.witem:hover{border-color:var(--moss);color:var(--ink);transform:translateX(2px)}
.witem.on{background:var(--moss-l);border-color:var(--moss);color:var(--moss-d);font-weight:600}
.witem .wp{font:600 9px/1 var(--mono);color:var(--clay);letter-spacing:.06em}
.warticle{border:1px solid var(--hair);border-radius:var(--r-md);background:var(--paper);padding:28px 30px;min-height:480px}
.wa-h{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.wa-h h3{font-family:var(--serif);font-size:30px;font-weight:500;letter-spacing:-.02em;color:var(--ink)}
.wa-h h3 em{font-style:italic;color:var(--moss)}
.wa-def{font-size:14px;color:var(--ink);line-height:1.75;padding:14px 18px;background:var(--moss-l);border-left:3px solid var(--moss);border-radius:0 var(--r-sm) var(--r-sm) 0;margin-bottom:14px}
.wa-body{font-size:13.5px;color:var(--ink2);line-height:1.85;margin-bottom:20px}
.wa-body em{font-style:italic;color:var(--moss-d);font-weight:500}
.wblk{border-top:1px solid var(--hair);padding-top:18px;margin-top:18px}
.wblk .wbt{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;margin-bottom:14px;font-family:var(--serif);letter-spacing:-.01em}
.wblk .wbt em{font-style:italic;color:var(--moss)}
.wblk .wbt .cnt{font:500 11px/1 var(--mono);color:var(--ink3);font-family:var(--mono);font-weight:500;font-style:italic;margin-left:auto}
.pgrp{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;margin:14px 0 10px}
.pgrp .cnt{font:400 10.5px/1 var(--mono);color:var(--ink3);font-weight:500;font-style:italic;margin-left:auto}
.pmods{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.pmod{border:1px solid var(--hair);border-radius:var(--r-md);background:var(--paper-d);overflow:hidden}
.pmod .pmh{display:flex;align-items:baseline;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--hair);background:var(--paper)}
.pmod .pmh b{font-size:13px;font-weight:600;font-family:var(--serif);letter-spacing:-.01em}
.pmod .pmh span{font:700 12px/1 var(--mono);font-style:italic}
.pmod.in .pmh span{color:var(--moss)} .pmod.ex .pmh span{color:var(--slate)}
.pmod .pup{font:500 9.5px/1.5 var(--mono);color:var(--ink4);padding:7px 16px 0;letter-spacing:.02em}
.pscroll{height:148px;overflow:hidden;-webkit-mask:linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent);mask:linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent)}
.ptrack{display:flex;flex-direction:column;padding:6px 16px;animation:pvscroll var(--pd,28s) linear infinite}
.pscroll:hover .ptrack{animation-play-state:paused}
.pti{font-size:12px;color:var(--ink2);padding:8px 0;border-bottom:1px dashed var(--hair);display:flex;gap:9px;align-items:baseline;line-height:1.5}
.pti b{color:var(--ink4);font:600 9.5px/1 var(--mono);font-weight:500;flex:none;letter-spacing:.04em}
.pmod.padd{border-style:dashed;display:grid;place-items:center;min-height:150px;color:var(--ink3);cursor:pointer;text-align:center;font-size:12.5px;line-height:1.8;background:var(--paper-d)}
.pmod.padd:hover{color:var(--moss);border-color:var(--moss);background:var(--moss-l)}
.pmod.padd .plus{font-family:var(--serif);font-size:28px;font-style:italic;line-height:1;color:var(--bronze);margin-bottom:4px}
.pmod.padd:hover .plus{color:var(--moss)}
.pmod.padd .sub{font-size:11px;color:var(--ink4);margin-top:6px}

.metastrip{display:flex;gap:14px;overflow-x:auto;padding:2px 2px 14px;scroll-snap-type:x proximity}
.metastrip::-webkit-scrollbar{height:6px}.metastrip::-webkit-scrollbar-thumb{background:var(--hair2);border-radius:3px}
.mcard{flex:0 0 282px;scroll-snap-align:start;border:1px solid var(--hair);border-radius:var(--r-md);background:var(--paper);padding:18px;display:flex;flex-direction:column;gap:11px;transition:.18s}
.mcard:hover{border-color:var(--bronze)}
.mcard .mch{display:flex;align-items:center;gap:8px}
.mcard .mp{font:600 9.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);background:var(--sage);padding:4px 8px;border-radius:5px}
.mcard .mct{font-family:var(--serif);font-size:19px;font-weight:500;letter-spacing:-.01em;color:var(--ink);line-height:1.2}
.mcard .mcl{font-size:12px;color:var(--ink2);line-height:1.7;font-style:italic;border-left:2px solid var(--bronze);padding-left:11px}
.mroles{display:flex;flex-direction:column;border:1px solid var(--hair);border-radius:8px;overflow:hidden}
.mr{display:grid;grid-template-columns:108px 1fr;font-size:11.5px;border-top:1px solid var(--hair)}
.mr:first-child{border-top:0}
.mr b{padding:7px 11px;background:var(--paper-d);color:var(--bronze);font:600 10px/1.4 var(--mono);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.mr span{padding:7px 11px;color:var(--ink2);line-height:1.5}
.mcard .msum{font-size:12px;color:var(--moss-d);background:var(--moss-l);border-radius:7px;padding:9px 12px;line-height:1.65;font-style:italic}
.mcard .note{display:flex;gap:9px;font-size:11.5px;color:var(--ink2);padding:8px 11px;background:var(--paper-d);border-radius:7px;line-height:1.55;border:1px dashed var(--hair2)}
.mcard .note b{color:var(--bronze);font-weight:600;flex:none}
.mcard textarea{width:100%;background:var(--paper-d);border:1px solid var(--hair);border-radius:7px;color:var(--ink);font-family:var(--sans);font-size:11.5px;padding:8px 10px;resize:vertical;min-height:48px;outline:none;transition:.15s}
.mcard textarea:focus{border-color:var(--moss)}

/* C/B seg + Brief */
.seg{display:inline-flex;background:var(--paper-d);border:1px solid var(--hair);border-radius:var(--r-pill);padding:3px;gap:3px}
.seg button{border:0;background:none;color:var(--ink3);font-family:var(--sans);font-size:12px;padding:7px 16px;border-radius:var(--r-pill);cursor:pointer;transition:.15s;font-weight:500}
.seg button.on{background:var(--moss);color:var(--paper)}
.briefsrc{display:flex;align-items:center;gap:8px;font:500 11px/1.55 var(--sans);color:var(--ink3);font-style:italic;margin-bottom:12px;padding:10px 14px;background:var(--moss-l);border-radius:8px;border-left:2px solid var(--moss)}
.briefsrc i{width:5px;height:5px;border-radius:50%;background:var(--moss);font-style:normal;flex:none;animation:blink 1.6s infinite}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.brole-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.brole{border:1px solid var(--hair);border-radius:var(--r-md);background:var(--paper-d);padding:14px 16px;cursor:pointer;transition:.15s}
.brole:hover{border-color:var(--moss)}
.brole.on{border-color:var(--moss);background:var(--moss-l)}
.brole .bt2{font-family:var(--serif);font-size:15px;font-weight:500;color:var(--ink);letter-spacing:-.01em;margin-bottom:5px}
.brole .bd2{font-size:11px;color:var(--ink3);line-height:1.5}

/* 4 steps */
.steps{display:flex;flex-direction:column;gap:4px}
.stp{display:grid;grid-template-columns:38px 1fr;gap:18px;padding:22px 0;border-top:1px solid var(--hair)}
.stp:first-child{border-top:0;padding-top:6px}
.stp .sn{width:30px;height:30px;border-radius:9px;border:1.5px solid var(--moss);background:var(--moss-l);color:var(--moss-d);display:grid;place-items:center;font:600 13px/1 var(--mono)}
.stp .sh{font-family:var(--serif);font-size:20px;font-weight:500;letter-spacing:-.01em;color:var(--ink);margin-bottom:6px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.stp .sh em{font-style:italic;color:var(--moss)}
.stp .sd{font-size:12.5px;color:var(--ink3);line-height:1.7;margin-bottom:14px;font-style:italic}

/* Step1 product row */
.prodrow{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.prod{border:1px solid var(--hair);border-radius:var(--r-md);background:var(--paper);padding:14px;cursor:pointer;transition:.18s;display:flex;flex-direction:column;gap:8px;position:relative}
.prod:hover{border-color:var(--moss);transform:translateY(-2px)}
.prod.on{border-color:var(--moss);background:var(--moss-l);box-shadow:0 0 0 1px var(--moss)}
.prod .pim{height:96px;border-radius:9px;overflow:hidden;background:linear-gradient(160deg,var(--sage),var(--paper-d));display:grid;place-items:center;border:1px solid var(--hair);position:relative}
.prod .pim .ph{font-family:var(--serif);font-size:42px;font-weight:500;font-style:italic;color:var(--bronze);opacity:.5}
.prod .pn{font-family:var(--serif);font-size:15px;font-weight:500;color:var(--ink);letter-spacing:-.01em;line-height:1.25}
.prod .pos{font-size:11px;color:var(--bronze);font-weight:500;line-height:1.5}
.prod .pxi{display:flex;gap:7px;font-size:10.5px;color:var(--ink4);line-height:1.5}
.prod .pxi b{color:var(--moss);font-weight:600;font-family:var(--mono);font-size:9px;letter-spacing:.04em;text-transform:uppercase;flex:none;padding-top:1px}
.prod .pxi span{color:var(--ink2);flex:1}
.prod.up{border-style:dashed;display:grid;place-items:center;min-height:218px;color:var(--ink3);background:var(--paper-d)}
.prod.up:hover{color:var(--moss);border-color:var(--moss);background:var(--moss-l)}
.prod.up .plus{font-family:var(--serif);font-size:32px;font-style:italic;line-height:1;margin-bottom:8px;text-align:center;color:var(--bronze)}
.prod.up:hover .plus{color:var(--moss)}
.prod.up .ul{font-size:12px;text-align:center}

/* 16 scenes */
.echo{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:11.5px;color:var(--ink2);background:var(--paper-d);border:1px dashed var(--hair2);border-radius:var(--r-sm);padding:10px 14px;margin-bottom:12px}
.echo b{color:var(--moss-d);font-weight:600;font-family:var(--serif);font-size:13.5px;font-style:italic}
.echo .fa{color:var(--ink4)}
.echo .sub{margin-left:auto;color:var(--ink4);font-style:italic;font-size:11px}
.scnlist{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.scn{border:1px solid var(--hair);border-left:3px solid var(--ac,var(--hair2));border-radius:var(--r-md);background:var(--paper);overflow:hidden;transition:.16s;align-self:start}
.scn:hover{border-color:var(--hair2)}
.scn.fit{background:var(--moss-l)}
.scn-hd{display:flex;align-items:center;gap:12px;padding:14px 18px;cursor:pointer}
.scn-code{font:700 10px/1 var(--mono);color:var(--ac,var(--ink3));border:1px solid var(--ac,var(--hair2));padding:4px 6px;border-radius:5px;flex:none;letter-spacing:.06em}
.scn-tt{flex:1;min-width:0}
.scn-nm{font-family:var(--serif);font-size:16px;font-weight:500;color:var(--ink);letter-spacing:-.01em;display:flex;align-items:center;gap:8px;flex-wrap:wrap;line-height:1.2}
.fitbadge{font:600 9px/1 var(--mono);color:var(--moss);background:var(--paper);border:1px solid var(--moss);padding:3px 6px;border-radius:5px;letter-spacing:.06em}
.scn-pain{font-size:11px;color:var(--ink4);margin-top:4px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scn-chev{color:var(--ink4);transition:transform .2s;flex:none;display:flex}
.scn.open .scn-chev{transform:rotate(90deg)}
.scn-body{display:none}
.scn.open .scn-body{display:block;padding:4px 18px 18px;animation:fadein .25s ease both}
.tassel{padding-left:6px}
.tnode{display:grid;grid-template-columns:26px 1fr;gap:12px;padding:9px 0;align-items:start}
.tnode+.tnode{border-top:1px dashed var(--hair)}
.tbead{width:26px;height:26px;border-radius:7px;display:grid;place-items:center;font:700 11px/1 var(--mono);color:var(--ac);background:color-mix(in srgb,var(--ac) 16%,transparent);border:1px solid color-mix(in srgb,var(--ac) 45%,transparent)}
.tth{font:600 10.5px/1.4 var(--mono);margin-bottom:4px;letter-spacing:.04em;text-transform:uppercase}
.ttx{font-size:12px;color:var(--ink2);line-height:1.65}
.tdata{display:flex;align-items:flex-start;gap:9px;margin-top:11px;font:500 11.5px/1.65 var(--sans);color:var(--moss-d);background:var(--paper-d);border:1px solid var(--moss-l);border-left:3px solid var(--moss);border-radius:8px;padding:11px 13px;font-style:italic}
.tdata i{width:5px;height:5px;border-radius:50%;background:var(--moss);margin-top:7px;flex:none;font-style:normal}
.scn-audit{margin-top:14px;border-top:1px dashed var(--hair);padding-top:13px}
.scn-audit .note{display:flex;gap:9px;font-size:11.5px;color:var(--ink2);padding:9px 12px;background:var(--moss-l);border-radius:7px;line-height:1.55;margin-bottom:9px}
.scn-audit .note b{color:var(--moss-d);font-weight:600;flex:none}
.scn-audit textarea{width:100%;background:var(--paper-d);border:1px solid var(--hair);border-radius:8px;color:var(--ink);font-family:var(--sans);font-size:12px;padding:10px 12px;resize:vertical;min-height:54px;outline:none;transition:.15s}
.scn-audit textarea:focus{border-color:var(--moss)}

/* Step4 raw mats with real video */
.rawgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.raw{border:1px solid var(--hair);border-radius:var(--r-md);background:var(--paper);overflow:hidden;transition:.18s}
.raw:hover{border-color:var(--moss);transform:translateY(-2px)}
.raw video{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:#0F1A15}
.raw .rwb{padding:14px 16px}
.raw .rw1{display:flex;align-items:center;justify-content:space-between;gap:8px;font-family:var(--serif);font-size:15px;font-weight:500;letter-spacing:-.01em;color:var(--ink);margin-bottom:6px}
.raw .sub{font-size:11px;color:var(--ink3);font-style:italic;line-height:1.55}

/* ====================================================
   营销企划组件
   ==================================================== */
.blines{display:flex;gap:9px;margin-bottom:14px;flex-wrap:wrap}
.bline{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600;color:var(--ink2);background:var(--paper);border:1px solid var(--hair);padding:9px 18px;border-radius:var(--r-pill);cursor:pointer;transition:.16s}
.bline:hover{color:var(--ink);border-color:var(--moss)}
.bline.on{color:var(--paper);border-color:var(--moss);background:var(--moss)}
.bline .bn2{font:600 10px/1 var(--mono);color:var(--ink4);font-weight:500;letter-spacing:.04em}
.bline.on .bn2{color:rgba(255,255,255,.72)}
.prodstrip{display:flex;gap:12px;overflow-x:auto;padding:2px 2px 12px;scroll-snap-type:x proximity}
.prodstrip::-webkit-scrollbar{height:6px}.prodstrip::-webkit-scrollbar-thumb{background:var(--hair2);border-radius:3px}
.prodc{flex:0 0 184px;scroll-snap-align:start;border:1px solid var(--hair);border-radius:var(--r-md);background:var(--paper);padding:12px;cursor:pointer;transition:.18s;display:flex;flex-direction:column;gap:7px;position:relative}
.prodc:hover{border-color:var(--moss);transform:translateY(-2px)}
.prodc.on{border-color:var(--moss);background:var(--moss-l);box-shadow:0 0 0 1px var(--moss)}
.prodc .pim{height:90px;border-radius:8px;overflow:hidden;background:linear-gradient(160deg,var(--sage),var(--paper-d));display:grid;place-items:center;border:1px solid var(--hair)}
.prodc .pim .ph{font-family:var(--serif);font-size:36px;font-weight:500;font-style:italic;color:var(--bronze);opacity:.55}
.prodc .pn{font-family:var(--serif);font-size:14px;font-weight:500;color:var(--ink);letter-spacing:-.01em;line-height:1.2}
.prodc .pos{font-size:10.5px;color:var(--bronze);font-weight:500;line-height:1.5}
.prodc .pxi{display:flex;gap:6px;font-size:10px;color:var(--ink4);line-height:1.4}
.prodc .pxi b{color:var(--moss);font-weight:600;font-family:var(--mono);font-size:8.5px;letter-spacing:.04em;text-transform:uppercase;flex:none;padding-top:1px}
.prodc .pxi span{color:var(--ink2);flex:1}
.prodc.up{border-style:dashed;display:grid;place-items:center;min-height:200px;color:var(--ink3);background:var(--paper-d);text-align:center}
.prodc.up:hover{color:var(--moss);border-color:var(--moss);background:var(--moss-l)}
.prodc.up .plus{font-family:var(--serif);font-size:28px;font-style:italic;line-height:1;margin-bottom:7px;color:var(--bronze)}
.prodc.up:hover .plus{color:var(--moss)}
.prodc.up .ul{font-size:11.5px}

/* 机会卡 opplist row */
.opplist{border:1px solid var(--hair);border-radius:var(--r-md);background:var(--paper);overflow:hidden}
.opprow{display:grid;grid-template-columns:7px 1fr auto;gap:0 18px;align-items:center;padding:16px 20px 16px 0;border-top:1px solid var(--hair);cursor:pointer;transition:background .15s;position:relative}
.opplist .opprow:first-child{border-top:0}
.opprow:hover{background:var(--paper-d)}
.opprow .obar{grid-row:1/3;align-self:stretch;width:3px;border-radius:0 3px 3px 0;background:var(--dc,var(--hair2))}
.opprow .om{min-width:0;padding-left:4px}
.opprow .ohead{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:6px}
.opprow .otitle{font-size:13.5px;font-weight:600;letter-spacing:-.005em;color:var(--ink);line-height:1.3}
.opprow .odim{font:600 10px/1 var(--mono);letter-spacing:.04em}
.opprow .oid{font:600 9.5px/1 var(--mono);color:var(--ink4);letter-spacing:.06em}
.opprow .ocombo{font-size:11.5px;color:var(--ink3);line-height:1.55}
.opprow .ocombo i{font-style:normal;font-weight:600}
.opprow .ocombo .sep{color:var(--ink5);margin:0 7px;opacity:.6}
.opprow .oright{display:flex;align-items:center;gap:16px;padding-right:6px}
.opprow .rellab{font:600 10.5px/1 var(--mono);color:var(--ink3);letter-spacing:.04em;transition:.15s}
.opprow:hover .rellab{color:var(--moss)}
.opprow.on{background:var(--moss-l)}
.opprow.on .obar{background:var(--moss)}
.opprow.on .rellab{color:var(--moss-d);font-weight:700}
.opprow .oscore{text-align:right;padding-left:6px}
.opprow .oscore b{font-family:var(--serif);font-size:24px;font-weight:500;font-style:italic;letter-spacing:-.02em;display:block;line-height:1}
.opprow .oscore span{font:500 9px/1 var(--mono);color:var(--ink4);letter-spacing:.06em;margin-top:3px;display:block}
.opprow.manual .otitle::after{content:"人工挖掘";margin-left:8px;font:600 9px/1 var(--mono);color:var(--bronze);background:var(--bronze-l);border:1px solid var(--bronze);padding:3px 6px;border-radius:5px;vertical-align:middle}
.gb{display:inline-flex;align-items:center;justify-content:center;font:700 11px/1 var(--mono);width:24px;height:24px;border-radius:6px;letter-spacing:.04em}
.gb.S{background:var(--grade-s);color:var(--paper)}
.gb.A{background:var(--moss-l);color:var(--grade-a);border:1px solid var(--grade-a)}
.gb.B{background:var(--bronze-l);color:var(--grade-b);border:1px solid var(--grade-b)}
.gb.C{background:var(--sage);color:var(--grade-c);border:1px solid var(--grade-c)}

/* 科学背书 schain */
.schains{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.schain{border:1px solid var(--hair);border-left:3px solid var(--ac,var(--moss));border-radius:var(--r-md);background:var(--paper);padding:14px 16px;cursor:pointer;transition:.16s;position:relative;display:flex;flex-direction:column;gap:9px}
.schain:hover{border-color:var(--hair2);transform:translateY(-1px)}
.schain.on{border-color:var(--moss);box-shadow:0 0 0 1px var(--moss);background:var(--moss-l)}
.schain.on::after{content:"✓ 已关联";position:absolute;top:12px;right:14px;font:600 10px/1 var(--mono);color:var(--moss-d);letter-spacing:.04em}
.schain .sc1{display:flex;align-items:center;gap:8px;font-family:var(--serif);font-size:14.5px;font-weight:500;letter-spacing:-.01em;color:var(--ink);padding-right:62px;flex-wrap:wrap;line-height:1.3}
.schain .mini .ms{display:grid;grid-template-columns:100px 1fr;gap:9px;padding:5px 0;border-top:1px dashed var(--hair);font-size:11px;align-items:start}
.schain .mini .ms:first-child{border-top:0}
.schain .mini .ms b{font:600 9.5px/1.5 var(--mono);letter-spacing:.04em;color:var(--ink3);text-transform:uppercase}
.schain .mini .ms b.lead{color:var(--ac)}
.schain .mini .ms span{color:var(--ink2);line-height:1.5;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.schain .src2{font:600 9.5px/1.5 var(--mono);color:var(--ink4);border-top:1px dashed var(--hair);padding-top:9px;margin-top:auto;letter-spacing:.04em;font-style:italic}
.schain .mcl2{font-size:11.5px;color:var(--ink2);line-height:1.65;font-style:italic;border-left:2px solid var(--bronze);padding-left:9px}
.schain .msum2{font-size:11px;color:var(--moss-d);background:var(--moss-l);border-radius:6px;padding:7px 10px;line-height:1.6}

/* L3 产线能力 */
.caphint{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--ink2);background:var(--moss-l);border:1px solid var(--moss-line);border-radius:var(--r-sm);padding:10px 14px;margin-bottom:12px}
.caphint b{color:var(--moss-d);font-weight:600}.caphint svg{color:var(--moss);flex:none;width:14px;height:14px}
.lcaps{display:grid;grid-template-columns:repeat(5,1fr);gap:11px;margin-bottom:6px}
.lcap{border:1px solid var(--hair);border-top:3px solid var(--c,var(--moss));border-radius:var(--r-md);background:var(--paper);padding:13px 14px;display:flex;flex-direction:column;gap:8px}
.lcap.l1{--c:var(--moss)}.lcap.l2{--c:var(--slate)}.lcap.l3{--c:var(--bronze)}.lcap.l4{--c:var(--clay)}.lcap.l5{--c:var(--plum)}
.lcap .lk1{display:flex;align-items:center;gap:7px;font-family:var(--serif);font-size:14px;font-weight:500;color:var(--ink);letter-spacing:-.01em;line-height:1.2}
.lcap .lk1 .badge{margin-left:auto}
.lcap .cap2{font-family:var(--serif);font-size:26px;font-style:italic;font-weight:500;color:var(--c);letter-spacing:-.02em;line-height:1}
.lcap .cap2 em{font:600 9.5px/1 var(--mono);color:var(--ink4);font-style:normal;margin-left:5px;letter-spacing:.04em;font-weight:500}
.lcap .pcap{font:600 9.5px/1 var(--mono);letter-spacing:.08em;color:var(--ink3);text-transform:uppercase;display:flex;align-items:center;gap:6px}
.lcap .pcap .auto{color:var(--moss);background:var(--moss-l);padding:3px 6px;border-radius:4px;font-weight:600}
.lcap .pcap .hu{color:var(--clay);background:var(--clay-l);padding:3px 6px;border-radius:4px;font-weight:600}
.lcap .smp{font-size:10.5px;color:var(--ink4);line-height:1.55;border-top:1px dashed var(--hair);margin-top:auto;padding-top:8px}

.needtitle{font-family:var(--serif);font-size:18px;font-weight:500;margin:20px 0 12px;display:flex;align-items:center;gap:10px;letter-spacing:-.01em}
.needtitle::before{content:"";width:4px;height:16px;border-radius:2px;background:var(--moss)}
.needs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:10px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{display:flex;align-items:center;gap:8px;font:600 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--moss)}
.field label::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--moss)}
.field input{width:100%;background:var(--paper-d);border:1px solid var(--hair);color:var(--ink);padding:12px 14px;border-radius:var(--r-sm);font-family:var(--serif);font-size:16px;font-weight:500;outline:none;transition:.16s;letter-spacing:-.005em}
.field input[type=number]{font-style:italic;color:var(--moss-d)}
.field input:focus{border-color:var(--moss);box-shadow:0 0 0 3px var(--moss-l)}
.nodeline{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-top:14px;padding:12px 14px;border:1px solid var(--hair);border-radius:var(--r-sm);background:var(--paper-d)}
.nodeline .nodelab{font-size:12.5px;color:var(--ink2);font-weight:500;flex:none}
.nodepills{display:flex;gap:8px;flex-wrap:wrap}
.nodepill{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--ink2);background:var(--paper);border:1px solid var(--hair);padding:7px 14px;border-radius:var(--r-pill);cursor:pointer;transition:.15s;font-weight:500}
.nodepill:hover{border-color:var(--moss);color:var(--moss)}
.nodepill.on{border-color:var(--moss);background:var(--moss);color:var(--paper)}
.nodepill em{font:600 9px/1 var(--mono);font-style:normal;color:var(--ink4);letter-spacing:.04em}
.nodepill.on em{color:rgba(255,255,255,.7)}
.nodeline .sub{margin-left:auto;font-size:11px;color:var(--ink4);font-style:italic}
.genrow{margin-top:20px;display:flex;justify-content:center}

/* 排期方案 plan */
.plan{border:1px solid var(--moss);border-radius:var(--r-lg);background:linear-gradient(180deg,var(--moss-l),var(--paper) 40%);padding:24px;margin-top:18px;animation:fadein .35s ease both}
.plan .plh{display:flex;align-items:center;gap:12px;margin-bottom:8px;flex-wrap:wrap}
.plan .plt{font-family:var(--serif);font-size:18px;font-weight:500;letter-spacing:-.01em}
.plan .lps{font:500 11px/1 var(--mono);color:var(--ink4);margin-left:auto;font-style:italic}
.plan .muted{font-size:12.5px;color:var(--ink2);line-height:1.7;margin-bottom:12px}
.gaxis{display:flex;justify-content:space-between;font:600 10px/1 var(--mono);color:var(--ink3);margin:18px 0 10px;padding:0 2px;letter-spacing:.06em}
.grow{display:grid;grid-template-columns:160px 92px 78px 1fr 90px;gap:14px;align-items:center;padding:11px 0;border-top:1px solid var(--hair);font-size:12.5px}
.grow .gn{font-family:var(--serif);font-size:14px;font-weight:500;color:var(--ink);letter-spacing:-.01em;line-height:1.25}
.grow .gn .sub{display:block;font:500 9.5px/1.4 var(--mono);color:var(--ink4);margin-top:4px;font-family:var(--mono);font-style:italic}
.grow input{width:100%;background:var(--paper);border:1px solid var(--hair);color:var(--moss-d);padding:8px 10px;border-radius:7px;font-family:var(--serif);font-size:15px;font-weight:500;font-style:italic;text-align:center;outline:none;transition:.15s}
.grow input:focus{border-color:var(--moss)}
.grow .gc{font:500 11px/1 var(--mono);color:var(--ink3);letter-spacing:.04em}
.gbar{height:20px;border-radius:7px;background:var(--paper-d);border:1px solid var(--hair);position:relative;overflow:hidden}
.gbar i{position:absolute;left:0;top:0;bottom:0;border-radius:7px;background:linear-gradient(90deg,var(--moss),rgba(91,117,96,.45));transition:width .4s}
.gband{position:absolute;top:-2px;bottom:-2px;background:rgba(91,117,96,.08);border-left:1px dashed rgba(91,117,96,.6);border-right:1px dashed rgba(91,117,96,.6)}
.grow .gd{font:600 12px/1 var(--mono);text-align:right;color:var(--moss-d);letter-spacing:.04em}
.plfoot{display:flex;align-items:center;gap:14px;margin-top:18px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--hair)}
.plfoot .sum{font-size:13px;color:var(--ink2)}.plfoot .sum b{font-family:var(--serif);font-size:18px;font-weight:500;font-style:italic;color:var(--moss-d);letter-spacing:-.02em}
.plfoot .act{margin-left:auto;display:flex;gap:10px}

/* 计划列表 task */
.task{display:grid;grid-template-columns:96px 1fr 92px 70px 96px 130px;gap:14px;align-items:center;padding:14px 0;border-top:1px solid var(--hair);font-size:12.5px}
.task:first-child{border-top:0}
.task .tid{font:600 11px/1 var(--mono);color:var(--bronze-d);background:var(--bronze-l);padding:5px 8px;border-radius:5px;letter-spacing:.04em;justify-self:start}
.task .tnm{font-family:var(--serif);font-size:15px;font-weight:500;color:var(--ink);letter-spacing:-.01em;line-height:1.25}
.task .tnm .sub{display:block;font-size:11px;color:var(--ink3);font-style:italic;margin-top:4px;font-family:var(--sans);font-weight:400;letter-spacing:0}
.task .tnum{font-family:var(--serif);font-size:18px;font-weight:500;font-style:italic;color:var(--moss-d);letter-spacing:-.02em}
.task .tnum span{color:var(--ink4);font-weight:500;font-size:10px;font-family:var(--mono);margin-left:4px}

.empty,.ledgerempty{padding:24px;text-align:center;color:var(--ink3);font-size:12.5px;border:1px dashed var(--hair2);border-radius:var(--r-md);line-height:1.75}

/* ====================================================
   产线工厂组件
   ==================================================== */
.kpi{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--hair);border-radius:var(--r-lg);overflow:hidden;margin-bottom:28px;background:var(--paper)}
.kpi .k{padding:22px 26px;border-left:1px solid var(--hair);position:relative}.kpi .k:first-child{border-left:0}
.kpi .k::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--c,var(--moss));opacity:.7}
.kpi .k.k1{--c:var(--moss)} .kpi .k.k2{--c:var(--slate)} .kpi .k.k3{--c:var(--bronze)} .kpi .k.k4{--c:var(--clay)}
.kpi .k b{font-family:var(--serif);font-size:46px;font-weight:500;font-style:italic;letter-spacing:-.03em;color:var(--c,var(--moss-d));line-height:1;display:block}
.kpi .k b em{font-family:var(--mono);font-size:18px;color:var(--ink4);font-style:normal;font-weight:500;margin-left:4px}
.kpi .k span{font-size:11.5px;color:var(--ink3);margin-top:10px;display:block;line-height:1.5}
.kpi .k span em{font-style:normal;display:block;font:500 9px/1 var(--mono);color:var(--ink4);margin-top:5px;text-transform:uppercase;letter-spacing:.12em}

.board{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pcard{border:1px solid var(--hair);border-radius:var(--r-lg);background:var(--paper);cursor:pointer;transition:.18s;overflow:hidden;display:flex;flex-direction:column;position:relative}
.pcard:hover{border-color:var(--moss);transform:translateY(-3px)}
.pcard.sel{border-color:var(--moss);box-shadow:0 0 0 1px var(--moss),0 14px 36px -20px var(--moss-line)}
.pcard .pt{height:3px;background:var(--moss)}.pcard.s-plan .pt{background:var(--bronze)}
.pcard .pb{padding:18px;display:flex;flex-direction:column;gap:14px;flex:1}
.pcard .p1{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.pcard .pnm{font-family:var(--serif);font-size:18px;font-weight:500;letter-spacing:-.01em;line-height:1.25}
.pcard .pid{font:600 10px/1 var(--mono);color:var(--ink4);margin-top:6px;letter-spacing:.04em}
.pcard .pbig{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pcard .bn{font-family:var(--serif);font-size:42px;font-weight:500;font-style:italic;letter-spacing:-.04em;color:var(--moss-d);line-height:1}
.pcard .bn small{font-family:var(--mono);font-size:18px;color:var(--ink4);font-style:normal;font-weight:500}
.pcard .bn .bl{display:block;font:500 10.5px/1 var(--mono);color:var(--ink3);margin-top:10px;letter-spacing:.04em;font-style:normal;text-transform:uppercase}
.ring{width:68px;height:68px;transform:rotate(-90deg);flex:none}
.ring .bgc{fill:none;stroke:var(--hair3);stroke-width:6}
.ring .fgc{fill:none;stroke:var(--moss);stroke-width:6;stroke-linecap:round;transition:stroke-dasharray .6s}
.ring text{transform:rotate(90deg);transform-origin:center;fill:var(--moss-d);font:700 13px var(--mono)}
.pcard .pmeta{display:flex;gap:16px;flex-wrap:wrap}
.pcard .pmeta .m{font-size:11px;color:var(--ink3);font-family:var(--mono);letter-spacing:.04em}
.pcard .pmeta .m b{color:var(--ink);font-weight:600;font-family:var(--mono);font-size:11.5px;margin-left:4px}
.pcard .plines{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--hair);padding-top:13px}
.pcard .pl{display:flex;align-items:center;gap:9px;font-size:11.5px}
.pcard .pl .pln{color:var(--ink2);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.pcard .pl .plb{width:64px;height:5px;background:var(--hair3);border-radius:3px;overflow:hidden;flex:none}.pcard .pl .plb i{display:block;height:100%;background:var(--moss);border-radius:3px}
.pcard .pl .plv{font:600 10.5px/1 var(--mono);color:var(--moss-d);width:50px;text-align:right;letter-spacing:.04em}
.pcard .pfoot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:14px;border-top:1px solid var(--hair)}
.prk{display:flex;gap:6px;flex-wrap:wrap}
.pcard .pfoot .sub{font:500 10px/1 var(--mono);color:var(--ink4);letter-spacing:.04em;font-style:italic}

/* linePanel */
.lpwrap{margin-top:18px;border:1px solid var(--hair);border-radius:var(--r-lg);background:var(--paper);animation:fadein .35s ease both}
.lph{display:flex;align-items:center;gap:12px;padding:18px 24px;border-bottom:1px solid var(--hair);flex-wrap:wrap}
.lph .lpt{font-family:var(--serif);font-size:18px;font-weight:500;letter-spacing:-.01em;color:var(--ink)}
.lph .lpt em{font-style:italic;color:var(--moss)}
.lph .lps{font:500 11px/1 var(--mono);color:var(--ink4);letter-spacing:.04em}
.lph .lpb{margin-left:auto;font:600 11px/1 var(--mono);color:var(--moss-d);background:var(--moss-l);padding:5px 10px;border-radius:5px;letter-spacing:.04em}
.lpgrid{display:grid;grid-template-columns:1fr 280px;gap:0}
.lines{padding:8px 24px 16px}
.lrow{display:grid;grid-template-columns:160px 1fr 140px;gap:18px;align-items:center;padding:17px 0;border-top:1px solid var(--hair);position:relative}
.lrow.popping{z-index:24}
.lrow:first-child{border-top:0}
.lrow.idle{opacity:.38}
.lrow .lnm{font-family:var(--serif);font-size:15px;font-weight:500;color:var(--ink);letter-spacing:-.01em;display:flex;align-items:center;gap:9px;line-height:1.25}
.lrow .lnm .ld{width:7px;height:7px;border-radius:2px;background:var(--moss);flex:none;animation:blink 1.6s infinite}
.lrow.idle .lnm .ld{background:var(--ink4);animation:none}
.lrow .lnm em{display:block;font:500 9.5px/1.4 var(--mono);color:var(--ink3);font-style:italic;margin-top:4px;letter-spacing:.04em}
.belt{position:relative;border:1px solid var(--hair);border-radius:var(--r-sm);background:var(--paper-d);padding:12px 14px}
.belt::after{content:"";position:absolute;left:14px;right:14px;top:50%;height:1px;background:linear-gradient(90deg,transparent,var(--moss-line),transparent)}
.belt .bflow{position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;gap:4px}
.nd{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;cursor:pointer;padding:4px 6px;border-radius:8px;transition:.15s;position:relative}
.lrow:not(.idle) .nd:hover{background:var(--moss-l)}
.nd.on{background:var(--moss-l);box-shadow:inset 0 0 0 1px var(--moss)}
.nd .ndt{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;background:var(--paper);border:1px solid var(--hair);color:var(--ink3);transition:.18s}
.nd .ndt svg{width:13px;height:13px}
.nd .ndt img{width:22px;height:22px;border-radius:5px;object-fit:cover}
.nd.on .ndt{border-color:var(--moss);color:var(--moss-d);background:var(--paper)}
.nd .ndx{font:500 10px/1 var(--mono);color:var(--ink3);white-space:nowrap;letter-spacing:.02em}
.nd.on .ndx{color:var(--moss-d);font-weight:600}
.belt .ndarw{color:var(--ink4);padding-top:8px;flex:none}
.belt .ndarw svg{width:12px;height:12px;display:block}
.belt .worker{position:absolute;z-index:3;top:24px;width:7px;height:7px;border-radius:50%;background:var(--moss);box-shadow:0 0 10px 2px rgba(91,117,96,.55),-10px 0 10px -3px rgba(91,117,96,.4),-20px 0 12px -5px rgba(91,117,96,.22);animation:plwork var(--dur,8s) linear infinite}
.lrow.idle .belt::after{background:var(--hair)}.lrow.idle .nd{cursor:default}
.lstat{text-align:right}
.lstat .lt1{font-family:var(--serif);font-size:17px;font-weight:500;font-style:italic;color:var(--moss-d);letter-spacing:-.02em;line-height:1}
.lstat .lt1 span{color:var(--ink4);font-weight:500;font-size:11px;font-family:var(--mono);font-style:normal;letter-spacing:.04em}
.lstat .lprog{height:5px;background:var(--hair3);border-radius:3px;overflow:hidden;margin-top:9px}
.lstat .lprog i{display:block;height:100%;background:linear-gradient(90deg,var(--moss),var(--bronze));border-radius:3px;transition:width .5s}
.lstat .lidle{font:500 11px/1 var(--mono);color:var(--ink4);letter-spacing:.04em;font-style:italic}

/* feed */
.feed{border-left:1px solid var(--hair);padding:16px 18px;display:flex;flex-direction:column;gap:9px;max-height:520px;overflow:hidden;background:var(--paper-d)}
.feed .fh{font:600 10px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--moss);display:flex;align-items:center;gap:8px;margin-bottom:6px;padding-bottom:8px;border-bottom:1px solid var(--hair)}
.feed .fh i{width:5px;height:5px;border-radius:50%;background:var(--moss);animation:blink 1.4s infinite}
.fd{display:flex;gap:10px;align-items:flex-start;padding:9px 11px;border:1px solid var(--hair);border-radius:9px;background:var(--paper);font-size:11.5px;line-height:1.55}
.fd .fi{width:28px;height:28px;border-radius:7px;background:var(--moss-l);display:grid;place-items:center;color:var(--moss);flex:none}
.fd .fi svg{width:14px;height:14px}
.fd .ft{color:var(--ink2);flex:1}.fd .ft b{color:var(--ink);font-weight:600}
.fd .fm{font:500 9.5px/1.4 var(--mono);color:var(--ink4);display:block;margin-top:3px;letter-spacing:.04em}

/* 真实产物 npop 气泡 */
.npop{position:absolute;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%);z-index:30;width:max-content;max-width:236px;background:var(--paper);border:1px solid var(--moss);border-radius:10px;padding:10px 12px;box-shadow:0 14px 32px -14px rgba(31,45,38,.32);animation:npopin .42s cubic-bezier(.2,1.1,.3,1) both;pointer-events:none}
.npop::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%) rotate(45deg);width:10px;height:10px;background:var(--paper);border-right:1px solid var(--moss);border-bottom:1px solid var(--moss);margin-top:-5px}
.npop .nt{font:600 9.5px/1 var(--mono);color:var(--moss-d);margin-bottom:8px;display:flex;align-items:center;gap:6px;letter-spacing:.08em;text-transform:uppercase}
.npop .nt i{width:4px;height:4px;border-radius:50%;background:var(--moss);font-style:normal;animation:blink 1.2s infinite;flex:none}
.npop .sc3{font-size:11.5px;color:var(--ink2);line-height:1.55;max-width:212px}
.npop .sc3 b{display:block;font-family:var(--serif);font-size:13px;color:var(--ink);margin-bottom:3px;font-weight:500;letter-spacing:-.01em}
.npop video{width:198px;aspect-ratio:16/9;object-fit:cover;border-radius:7px;display:block;background:#0F1A15}
.npop img.pp{width:158px;border-radius:7px;display:block}
.npop .iprow2{display:flex;align-items:center;gap:10px}
.npop img.ipp{width:44px;height:44px;border-radius:9px;object-fit:cover;display:block;flex:none;background:var(--sage)}
.npop .ipname{font-family:var(--serif);font-size:14px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.npop .wave{display:flex;align-items:flex-end;gap:2.5px;height:24px;width:152px;margin:3px 0 2px}
.npop .wave i{flex:1;background:linear-gradient(180deg,var(--moss),var(--moss-l));border-radius:2px;animation:wave .85s ease-in-out infinite alternate;transform-origin:bottom}
.npop .mono2{font-family:var(--serif);font-size:24px;font-style:italic;font-weight:500;color:var(--moss-d);letter-spacing:-.02em;line-height:1}

/* drawer */
.dmask{position:fixed;inset:0;background:rgba(15,26,21,.42);backdrop-filter:blur(3px);z-index:108;opacity:0;pointer-events:none;transition:.26s}
.dmask.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100vh;width:min(478px,94vw);background:var(--paper);border-left:1px solid var(--hair);z-index:112;transform:translateX(103%);transition:transform .34s cubic-bezier(.3,.95,.25,1);display:flex;flex-direction:column;box-shadow:-34px 0 90px -34px rgba(31,45,38,.32)}
.drawer.on{transform:none}
.drawer .dh2{padding:18px 22px;border-bottom:1px solid var(--hair);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.drawer .dh2 .dt2{font-family:var(--serif);font-size:16px;font-weight:500;letter-spacing:-.01em}
.drawer .dh2 .nps{font:500 11px/1 var(--mono);color:var(--ink4);letter-spacing:.04em;font-style:italic}
.drawer .dh2 .prog{margin-left:auto;font:500 11px/1 var(--mono);color:var(--ink3);letter-spacing:.04em}
.drawer .dh2 .prog b{color:var(--moss-d);font-weight:600;font-family:var(--serif);font-style:italic;font-size:14px;letter-spacing:-.01em}
.drawer .db2{flex:1;overflow-y:auto;padding:20px 22px}
.drawer .df2{padding:14px 22px;border-top:1px solid var(--hair);display:flex;gap:9px;flex-wrap:wrap;background:var(--paper-d)}
.drawer textarea{width:100%;background:var(--paper-d);border:1px solid var(--hair);border-radius:9px;color:var(--ink);font-family:var(--sans);font-size:12.5px;line-height:1.7;padding:12px 14px;resize:vertical;min-height:140px;outline:none;transition:.15s}
.drawer textarea:focus{border-color:var(--moss)}
.dlab{font:600 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--moss);margin:18px 0 10px;display:flex;align-items:center;gap:7px}
.dlab::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--moss)}
.dlab:first-of-type{margin-top:0}
.drawer input[type=range]{width:100%;accent-color:var(--moss)}
.iprow{display:flex;gap:12px;margin-bottom:4px}
.ipc{text-align:center;cursor:pointer;padding:10px;border:1px solid var(--hair);border-radius:var(--r-sm);background:var(--paper-d);transition:.15s;width:96px;flex:none}
.ipc:hover{border-color:var(--moss);transform:translateY(-2px)}
.ipc.on{border-color:var(--moss);box-shadow:0 0 0 1px var(--moss);background:var(--moss-l)}
.ipc img{width:60px;height:60px;border-radius:10px;object-fit:cover;display:block;margin:0 auto 8px;background:var(--sage)}
.ipc .in2{font-family:var(--serif);font-size:13px;font-weight:500;letter-spacing:-.01em}
.ipc .is2{font:500 9.5px/1.4 var(--mono);color:var(--ink4);margin-top:4px;letter-spacing:.04em}
.npgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.npgrid .g{padding:12px 14px;border:1px solid var(--hair);border-radius:9px;background:var(--paper-d)}
.npgrid .g b{font-family:var(--serif);font-size:24px;font-style:italic;font-weight:500;color:var(--moss-d);letter-spacing:-.03em;display:block;line-height:1}
.npgrid .g span{font:500 9.5px/1.4 var(--mono);color:var(--ink3);margin-top:7px;display:block;letter-spacing:.04em}
.outline-list .oli{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;padding:10px 12px;border:1px solid var(--hair);background:var(--paper-d);border-radius:8px;margin-bottom:8px}
.outline-list .oli span:first-child{color:var(--ink2);font-weight:500}
.outline-list .oli span:last-child{color:var(--ink4);font:500 10.5px/1.5 var(--mono);letter-spacing:.04em}
.thv-row{display:flex;align-items:baseline;gap:10px;font:500 10px/1 var(--mono);color:var(--ink3);letter-spacing:.04em;margin-bottom:6px}
.thv-row b{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--moss-d);font-weight:500}
