
/* ============================================================
   WOD Shenzhen 2026 — UI 改版视觉规范 V1.0
   ------------------------------------------------------------
   设计原则：WOD 负责「品牌与科技」，DMP 负责「行动与转化」，
            中性色负责「信息承载」，辅助色只用于状态与数据。
   配色比例：70% 中性背景 / 20% WOD 蓝紫色信息层 / 8% DMP 行动色 / 2% AI 与状态辅助色

   全局 Token：
     --wod-dark:#09112C  --wod-primary:#383993  --wod-slate:#273354  --wod-blue:#383993
     --dmp-orange:#E26B0F  --dmp-amber:#F5A200  --ai:#13DDC4  --success:#21D382  --accent:#C1478C
     --text:#09112c  --muted:#999999  --bg:#FAFAFA  --surface:#FFFFFF  --border:#D9D9D9
   ============================================================ */
:root{
  /* ===== WOD 品牌色 ===== */
  --wod-dark:#09112C;       /* 最深背景/标题 */
  --wod-blue-purple:#383993;/* WOD 蓝紫色（原深蓝紫） */
  --wod-primary:var(--wod-blue-purple); /* 兼容旧名 */
  --wod-slate:#273354;      /* 次级文字/信息层 */
  --wod-blue:#3583BE;       /* 链接/Info */

  /* ===== WOD 行动/转化色 ===== */
  --wod-orange-red:#EA553D; /* WOD 橙红色（原 CTA 珊瑚红） */
  --cta-coral:var(--wod-orange-red); /* 兼容旧名 */
  --dmp-orange:#E26B0F;     /* DMP 行动橙（规范定义，用于渐变/数据/选中态） */
  --dmp-amber:#F5A200;      /* 琥珀/次级行动 */
  --dmp-yellow:#FFF100;     /* DMP 黄色 */
  --dmp-highlight:var(--dmp-yellow); /* 兼容旧名 */
  --danger:#9F0E16;         /* 异常/危险 */

  /* ===== 辅助/状态色 ===== */
  --ai:#13DDC4;             /* AI / Success */
  --info:#2EA7FF;           /* Info */
  --success:#21D382;        /* Positive */
  --accent:#C1478C;         /* Accent */
  --disabled:#C2CEDE;       /* Disabled */

  /* ===== 兼容旧变量名（全局替换后仍被大量引用） ===== */
  --red:var(--dmp-orange);
  --red-d:#C45A0B;
  --red-l:var(--dmp-amber);
  --blue:var(--wod-primary);
  --blue-d:var(--wod-slate);
  --cyan:var(--wod-blue);
  --cyan-d:var(--wod-slate);
  --teal:var(--ai);
  --gold:var(--dmp-amber);
  --orange:var(--dmp-orange);
  --green:var(--success);
  --violet:var(--wod-primary);
  --rose:var(--accent);

  /* ===== 中性色 ===== */
  --txt:#EAEEF5;            /* 深色主题主文字 */
  --txt2:#B9C4D6;           /* 深色主题次文字 */
  --muted:#7E8AA0;          /* 深色主题弱化文字 */
  --dim:#999999;            /* 更弱文字 */

  /* ===== 圆角 / 布局 ===== */
  --rad:16px; --rad-l:22px; --rad-s:10px;
  --mw:1280px;

  /* ===== 阴影 / 发光 ===== */
  --shadow:0 24px 60px -20px rgba(0,0,0,.7);
  --glow:0 0 0 1px rgba(234,85,61,.35), 0 12px 40px -10px rgba(234,85,61,.45);

  /* ===== 字体 =====
     中文主题字：阿里妈妈数黑体（Alimama ShuHeiTi / AlimamaShuHeiTi-Bold）
     中文正文/小标题：思源黑体 Source Han Sans CN
     数字/英文标题：DIN Alternate / Bahnschrift */
  --ff-title:"Alimama ShuHeiTi","AlimamaShuHeiTi-Bold","AlimamaShuHeiTi","Source Han Sans CN","PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --ff-body:"Source Han Sans CN","SourceHanSansCN","PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --ff:"Source Han Sans CN","PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --fn:"DIN Alternate","Bahnschrift","Helvetica Neue",Arial,sans-serif;

  /* ===== 深色主题表面 ===== */
  --tint:255,255,255;
  --surf:9,17,44;
  --on:#ffffff;
  --field:rgba(0,0,0,.4);
  --inset:rgba(0,0,0,.4);
  --ink:#09112c; --ink2:#0f172a; --panel:#111827; --panel2:#1a2238;
  --line:rgba(var(--tint),.08); --line2:rgba(var(--tint),.15);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth;scroll-padding-top:112px}
body{
  font-family:var(--ff-body);background:var(--ink);color:var(--txt);
  line-height:1.75;font-size:15px;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,.sec-title,.btn{font-family:var(--ff-title)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
::selection{background:rgba(234,85,61,.4)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--ink)}
::-webkit-scrollbar-thumb{background:#1E2E48;border-radius:8px;border:2px solid var(--ink)}
::-webkit-scrollbar-thumb:hover{background:#2C4468}

/* ---------- ambient background ---------- */
.bg-fx{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bg-fx .grid{
  position:absolute;inset:-2px;
  background-image:linear-gradient(rgba(var(--tint),.028) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(var(--tint),.028) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 100% 70% at 50% 0%,#000 30%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 100% 70% at 50% 0%,#000 30%,transparent 78%);
}
.orb{position:absolute;border-radius:50%;filter:blur(110px);opacity:.5;animation:float 22s ease-in-out infinite}
.orb.a{width:720px;height:720px;background:radial-gradient(circle,#E26B0F,transparent 68%);top:-280px;left:-160px}
.orb.b{width:620px;height:620px;background:radial-gradient(circle,#13DDC4,transparent 68%);top:340px;right:-220px;animation-delay:-8s}
.orb.c{width:540px;height:540px;background:radial-gradient(circle,#E26B0F,transparent 70%);top:1500px;left:16%;animation-delay:-14s}
@keyframes float{0%,100%{transform:translate3d(0,0,0)}33%{transform:translate3d(46px,-38px,0)}66%{transform:translate3d(-32px,30px,0)}}

/* ---------- layout ---------- */
.wrap{max-width:var(--mw);margin:0 auto;padding:0 32px;position:relative;z-index:2}
section{position:relative;z-index:2;padding:52px 0}
.sec-head{margin-bottom:52px;max-width:820px}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--cyan);font-weight:700;margin-bottom:18px}
.eyebrow::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,var(--cyan),transparent)}
h1,h2,h3,h4{line-height:1.24;letter-spacing:-.015em;font-weight:800}
h2.sec-title{font-size:clamp(30px,3.6vw,46px)}
.sec-sub{color:var(--txt2);font-size:16.5px;margin-top:16px;line-height:1.85}
.grad{background:var(--wod-orange-red) ;
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.grad-gold{background:linear-gradient(96deg,var(--dmp-yellow),var(--dmp-amber) 50%,var(--dmp-orange));
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
/* 全站大标题统一暖色：琥珀 →DMP 橙  → WOD 橙红色 */
h2.sec-title{background:linear-gradient(96deg,var(--dmp-amber),var(--dmp-orange) 50%,var(--wod-orange-red));
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 26px;border-radius:12px;border:1px solid transparent;
  font-weight:700;font-size:14.5px;cursor:pointer;transition:.28s cubic-bezier(.4,0,.2,1);
  background:transparent;position:relative;overflow:hidden;white-space:nowrap}
.btn-p{background:linear-gradient(96deg,var(--wod-orange-red),var(--dmp-orange));color:#ffffff;
  box-shadow:0 10px 28px -10px rgba(234,85,61,.55)}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 16px 44px -10px rgba(234,85,61,.8);filter:brightness(1.02)}
.btn-g{background:linear-gradient(#fff,#fff) padding-box,
              linear-gradient(96deg,var(--wod-orange-red),var(--dmp-amber) 55%,var(--dmp-orange)) border-box;
  background-clip:padding-box,border-box;color:var(--wod-orange-red);border:1.5px solid transparent}
.btn-g:hover{transform:translateY(-2px);box-shadow:0 12px 34px -12px rgba(234,85,61,.32)}
/* 实心橙次按钮：DMP 橙 #E26B0F，用于内容区次要动作（与导航白底灰边次按钮区分） */
.btn-s{background:var(--dmp-orange);color:#FFFFFF;border:1.5px solid var(--dmp-orange);
  box-shadow:0 10px 26px -10px rgba(226,107,15,.5)}
.btn-s:hover{transform:translateY(-2px);box-shadow:0 16px 40px -10px rgba(226,107,15,.72);filter:brightness(1.03)}
/* Why Exhibit区次按钮：白底 + 橙描边，hover 渐变描边 + 投影（参考截图 4/5） */
#why .btn-s{background:#FFFFFF;color:var(--dmp-orange);border:1.5px solid var(--dmp-orange);
  box-shadow:none}
#why .btn-s:hover{background:#FFFFFF;color:var(--wod-orange-red);
  border-color:transparent;
  background-image:linear-gradient(#fff,#fff) padding-box,
                   linear-gradient(96deg,var(--wod-orange-red),var(--dmp-orange)) border-box;
  background-clip:padding-box,border-box;
  box-shadow:0 14px 36px -12px rgba(234,85,61,.32);
  filter:none}
/* 导航栏 Secondary 按钮：白底 + 中性灰边框；hover 渐变边框 + 轻投影 */
.nav-cta .btn-g{background:#FFFFFF;color:var(--text);border:1.5px solid var(--border);
  background-clip:border-box}
.nav-cta .btn-g:hover{transform:translateY(-2px);box-shadow:0 12px 34px -12px rgba(234,85,61,.28);
  border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(96deg,var(--wod-orange-red),var(--dmp-amber) 55%,var(--dmp-orange)) border-box;
  background-clip:padding-box,border-box;
  color:var(--text)}
.btn-o{background:transparent;color:var(--wod-blue);border-color:transparent;padding-left:18px;padding-right:18px}
.btn-o:hover{color:var(--wod-primary);transform:translateY(-2px)}
.btn-o::after{content:"→";margin-left:6px;transition:.25s}
.btn-o:hover::after{transform:translateX(4px)}
.btn-sm{padding:9px 18px;font-size:13px}
.nav-cta .btn-sm{padding:9px 12px;font-size:12.5px}
.btn-lg{padding:16px 34px;font-size:16px}

.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--rad);padding:30px;
  transition:.34s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}
.card:hover{transform:translateY(-6px);border-color:var(--cta-coral);box-shadow:0 24px 50px -22px rgba(234,85,61,.2),0 0 0 1px rgba(234,85,61,.35)}
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
/* 高亮推荐卡片 */
.card.hl{background:linear-gradient(160deg,rgba(245,162,0,.08),rgba(255,255,255,.98));border-color:rgba(226,107,15,.45)}
.card.hl:hover{border-color:var(--cta-coral);box-shadow:0 24px 50px -22px rgba(234,85,61,.25),0 0 0 1px rgba(234,85,61,.45)}

/* ---- News tag (same as Chinese site) ---- */
.news-tag{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;padding:3px 10px;border-radius:100px;font-weight:800;background:rgba(53,131,190,.10);color:#3583BE;border:1px solid rgba(53,131,190,.28)}
.news-tag.pinned-tag{background:rgba(53,131,190,.14);color:#3583BE;border-color:rgba(53,131,190,.4)}
.news-tag .pin{font-size:11px}

/* ===== Why Exhibit：对齐参考图（白卡 + 深字 #09112C + 灰字 #5A5858 + 橙/琥珀渐变描边 hover） ===== */
#why .card{background:#FFFFFF;border:1px solid #E8EEF6;color:#09112C;
  box-shadow:0 10px 34px -18px rgba(9,17,44,.16)}
#why .card:hover{border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(96deg,var(--dmp-amber),var(--dmp-orange)) border-box;
  background-clip:padding-box,border-box;
  box-shadow:0 26px 54px -22px rgba(226,107,15,.30)}
#why .card h3{color:#09112C!important}
#why .card p{color:#5A5858!important}
#why .card p b{color:#09112C!important}
#why .pl{background:#FFFFFF;border:1px solid #E8EEF6}
#why .pl:hover{background:rgba(226,107,15,.06);border-color:rgba(226,107,15,.42);transform:translateX(4px)}
#why .pl b{color:#09112C!important}
#why .pl s{color:#5A5858!important}

/* ---------- top utility bar ---------- */
.util{position:relative;z-index:60;background:rgba(var(--surf),.9);border-bottom:1px solid var(--line);
  font-size:12.5px;color:var(--muted)}
.util .wrap{display:flex;align-items:center;justify-content:space-between;height:40px;gap:16px}
.util-l{display:flex;gap:18px;align-items:center}
.util-r{display:flex;gap:14px;align-items:center}
.util a:hover,.util button:hover{color:var(--wod-primary)}
.util button{background:none;border:none;cursor:pointer;color:inherit;font-size:12.5px;display:flex;align-items:center;gap:6px}
.lang{border:1px solid var(--line);border-radius:100px;padding:2px;display:flex}
.lang b{padding:2px 11px;border-radius:100px;font-size:11.5px;cursor:pointer;font-weight:600}
.lang b.on{background:var(--blue);color:#fff}
.live-dot{width:6px;height:6px;border-radius:50%;background:var(--green);
  box-shadow:0 0 0 0 rgba(52,211,153,.7);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}

.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.98);
  backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);
  border-bottom:1px solid var(--border);transition:.3s;box-shadow:0 4px 20px -12px rgba(9,17,44,.18)}
.nav.solid{background:#FFFFFF;box-shadow:0 12px 40px -18px rgba(9,17,44,.18)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
.logo{display:flex;align-items:center;gap:13px;flex:0 0 auto}
.logo img{height:42px;width:auto;display:block}
.logo .mk{width:42px;height:42px;border-radius:12px;
  background:linear-gradient(135deg,var(--wod-primary),var(--wod-blue));
  display:grid;place-items:center;font-weight:900;font-size:16px;color:#ffffff;
  letter-spacing:-.04em;box-shadow:0 8px 24px -8px rgba(56,57,147,.35)}
.logo .tx b{display:block;font-size:15.5px;font-weight:800;letter-spacing:.01em;line-height:1.3;color:var(--wod-dark)}
.logo .tx s{display:block;font-size:10.5px;color:var(--muted);text-decoration:none;letter-spacing:.1em}
.menu{display:flex;gap:2px;align-items:center;flex:1;justify-content:center}
.menu>li{list-style:none;position:relative}
.menu>li>a{display:block;padding:10px 13px;font-size:14px;font-weight:600;color:var(--txt);
  border-radius:0;transition:.22s;white-space:nowrap;position:relative}
.menu>li>a::after{content:"";position:absolute;bottom:4px;left:13px;right:13px;height:2px;
  background:linear-gradient(90deg,var(--wod-orange-red),var(--dmp-amber) 60%,var(--dmp-orange));
  transform:scaleX(0);transform-origin:left;transition:.28s cubic-bezier(.4,0,.2,1)}
.menu>li>a:hover{color:var(--txt);background:transparent}
.menu>li>a:hover::after{transform:scaleX(1)}
.menu>li.act>a{color:var(--dmp-orange);background:transparent}
.menu>li>a .car{font-size:9px;opacity:.5;margin-left:4px}
.dd{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(8px);
  min-width:250px;background:#FFFFFF;border:1px solid var(--border);border-radius:0px;
  padding:10px;opacity:0;visibility:hidden;transition:.24s;box-shadow:var(--shadow);
  backdrop-filter:blur(20px)}
.menu>li:hover .dd{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dd a{display:flex;align-items:center;gap:10px;padding:9px 13px;border-radius:9px;font-size:13.5px;color:var(--txt2);transition:.18s}
.dd a:hover{background:rgba(56,57,147,.08);color:var(--wod-primary);transform:translateX(3px)}
.dd a i{font-style:normal;opacity:.6;font-size:12px}
.nav-cta{display:flex;gap:10px;align-items:center;flex:0 0 auto}
.burger{display:none;background:none;border:1px solid var(--line2);border-radius:10px;width:42px;height:42px;cursor:pointer}
.burger span{display:block;width:18px;height:1.6px;background:var(--txt);margin:4px auto;transition:.25s}

/* ---------- hero ---------- */
.hero{padding:86px 0 96px;position:relative;z-index:2;overflow:hidden}
/* hero 首屏 */
.hero h1{font-size:clamp(26.6px,3.92vw,51.8px);font-weight:900;letter-spacing:-.03em;line-height:1.1;color:var(--wod-dark)}
.hero h1 .l2{display:block;white-space:nowrap;font-size:clamp(17px,2.6vw,34px);line-height:1.25;margin-top:.35em}
.hero h1 .l2:first-child{margin-top:0}
.hero h1 .l2.grad{background:linear-gradient(96deg,var(--dmp-amber),var(--dmp-orange),var(--wod-orange-red));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hero-invite{display:flex;flex-direction:column;gap:1.8em;margin-bottom:18px;font-size:clamp(21.3px,3.14vw,41.4px);font-weight:800;letter-spacing:-.01em;color:var(--wod-dark);line-height:1.2;position:relative;z-index:3}
.hero-invite .sm{font-size:19px;font-weight:700;display:inline-block;background:linear-gradient(96deg,var(--dmp-orange) 0%,var(--dmp-amber) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;letter-spacing:.04em}
.hero-invite .grad-gold{background:linear-gradient(96deg,var(--dmp-yellow),var(--dmp-amber) 50%,var(--dmp-orange));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero-sub{margin-top:22px;font-size:17px;color:var(--txt2);max-width:640px;line-height:1.9}
.hero-meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hm{display:flex;align-items:center;gap:9px;padding:10px 18px;border:1px solid var(--line);
  border-radius:12px;background:rgba(var(--tint),.04);font-size:13.5px;color:var(--txt2)}
.hm b{color:var(--wod-dark);font-weight:700}
.hm .ic{font-size:15px}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
.hero-note{margin-top:18px;font-size:12.5px;color:#999999}
/* hero light-mode overrides */
.hero .rolebar{border-radius:14px}
.hero .rolebar,
.hero .rolebar span{color:#3a3a4a!important}
.hero .rolebar button{background:#E26B0F;color:#fff;border-color:#E26B0F}

.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start;position:relative;z-index:3}
/* countdown */
.cdown{border:1px solid var(--line);border-radius:var(--rad-l);padding:26px;
  background:var(--panel2);
  backdrop-filter:blur(14px)}
.cdown .lbl{font-size:12px;letter-spacing:.2em;color:var(--cyan);font-weight:700;text-transform:uppercase}
.cd-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}
.cd-c{background:var(--inset);border:1px solid var(--line);border-radius:13px;padding:14px 6px;text-align:center}
.cd-c b{display:block;font-family:var(--fn);font-size:32px;font-weight:700;color:var(--wod-primary);line-height:1;font-variant-numeric:tabular-nums}
.cd-c s{display:block;text-decoration:none;font-size:11px;color:var(--muted);margin-top:7px;letter-spacing:.1em}
/* stats */
.stats-tagline{font-size:15px;font-weight:700;letter-spacing:.02em;color:var(--txt);margin-bottom:12px;line-height:1.4}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}
.st{border:1px solid var(--line);border-radius:14px;padding:17px 18px;background:rgba(var(--tint),.035);
  transition:.28s;cursor:default}
.st:hover{background:rgba(226,107,15,.08);border-color:rgba(226,107,15,.45);transform:translateY(-3px)}
.st b{display:inline-flex;align-items:baseline;font-family:var(--fn);font-size:27px;font-weight:700;color:var(--wod-dark);line-height:1.1;font-variant-numeric:tabular-nums}
.st b+i{font-style:normal;font-size:18px;color:currentColor;margin-left:1px;font-weight:700}
.st s{display:block;text-decoration:none;font-size:12px;color:var(--muted);margin-top:5px}

/* ---------- role gate ---------- */
.gate{position:fixed;inset:0;z-index:200;background:rgba(2,5,12,.86);
  backdrop-filter:blur(16px);display:grid;place-items:center;padding:24px;
  opacity:0;visibility:hidden;transition:.4s}
.gate.on{opacity:1;visibility:visible}
.gate-box{max-width:1000px;width:100%;background:linear-gradient(160deg,#0D1728,#09112c);
  border:1px solid var(--line2);border-radius:26px;padding:44px;box-shadow:var(--shadow);
  transform:translateY(22px) scale(.98);transition:.45s cubic-bezier(.2,.9,.3,1)}
.gate.on .gate-box{transform:none}
.gate h3{font-size:clamp(22px,2.6vw,32px)}
.gate p.g-sub{color:var(--txt2);margin-top:12px;font-size:15px}
.roles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:32px}
.role{border:1px solid var(--line);border-radius:18px;padding:24px 20px;cursor:pointer;
  background:rgba(var(--tint),.03);transition:.3s;text-align:left;position:relative;overflow:hidden}
.role:hover{transform:translateY(-6px);border-color:var(--cyan);background:rgba(226,107,15,.1);
  box-shadow:0 18px 44px -16px rgba(226,107,15,.5)}
.role .ico{font-size:28px;margin-bottom:12px;display:block}
.role b{display:block;font-size:16.5px;font-weight:800}
.role s{display:block;text-decoration:none;font-size:12.5px;color:var(--muted);margin-top:7px;line-height:1.7}
.role .arw{position:absolute;right:18px;bottom:16px;color:var(--cyan);opacity:0;transform:translateX(-6px);transition:.3s}
.role:hover .arw{opacity:1;transform:none}
.gate-skip{margin-top:26px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
  font-size:12.5px;color:var(--dim)}
.gate-skip button{background:none;border:none;color:var(--muted);cursor:pointer;text-decoration:underline;font-size:12.5px}
.gate-skip button:hover{color:var(--cyan)}

/* ---------- role banner ---------- */
.rolebar{display:none;align-items:center;gap:14px;padding:13px 22px;border-radius:14px;
  background:linear-gradient(96deg,rgba(226,107,15,.2),rgba(226,107,15,.08));
  border:1px solid rgba(226,107,15,.32);margin-bottom:34px;font-size:14px;flex-wrap:wrap}
.rolebar.on{display:flex}
.rolebar .tagd{background:var(--cyan);color:var(--wod-dark);padding:3px 12px;border-radius:100px;font-weight:800;font-size:12.5px}
.rolebar button{margin-left:auto;background:none;border:1px solid var(--line2);border-radius:100px;
  padding:5px 14px;font-size:12.5px;cursor:pointer;color:var(--txt2)}
.rolebar button:hover{border-color:var(--cyan);color:var(--cyan)}

/* ---------- identity selector (util bar) ---------- */
.identity-sel{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;vertical-align:middle}
.identity-sel .lbl{color:var(--muted);white-space:nowrap}
.identity-sel .opt{display:inline-flex;align-items:center;gap:4px;padding:3px 11px;border-radius:100px;
  border:1px solid var(--line);background:rgba(var(--tint),.04);cursor:pointer;color:var(--txt2);
  font-size:12px;font-weight:600;transition:.25s;white-space:nowrap;line-height:1.6}
.identity-sel .opt:hover{border-color:rgba(226,107,15,.45);color:var(--red-l)}
.identity-sel .opt.on{background:linear-gradient(96deg,rgba(226,107,15,.22),rgba(226,107,15,.1));
  border-color:rgba(226,107,15,.45);color:#E26B0F;font-weight:800;
  box-shadow:0 0 0 1px rgba(226,107,15,.15),inset 0 0 8px rgba(226,107,15,.08)}

.chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.chip{padding:8px 15px;border-radius:100px;border:1px solid var(--border);background:var(--panel);
  font-size:13px;color:var(--txt);cursor:pointer;transition:.24s;user-select:none;position:relative}
.chip:hover{color:var(--wod-primary);background:var(--panel2);transform:translateY(-2px);border-color:var(--wod-primary)}
.chip.on{background:rgba(226,107,15,.10);border-color:rgba(226,107,15,.45);color:var(--dmp-orange);font-weight:700}
.chip.on::before{content:"✓ ";font-weight:900}
/* AI 标签 */
.chip.ai{background:rgba(19,221,196,.10);border-color:rgba(19,221,196,.35);color:#0A8E7A}
.chip.ai:hover{background:rgba(19,221,196,.16);border-color:rgba(19,221,196,.55)}
/* 状态成功标签 */
.chip.ok{background:rgba(33,211,130,.10);border-color:rgba(33,211,130,.35);color:#158a52}
.chip.ok:hover{background:rgba(33,211,130,.16);border-color:rgba(33,211,130,.55)}

/* ---------- driver tabs ---------- */

/* ---------- market chart ---------- */
.mkt{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.bars{display:flex;align-items:flex-end;gap:26px;height:200px;margin:26px 0 10px}
.bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;height:100%}
.bar .col{width:100%;max-width:92px;border-radius:12px 12px 4px 4px;position:relative;
  background:var(--wod-primary);height:0;transition:height 1.3s cubic-bezier(.2,.9,.3,1)}
.bar.cy .col{background:var(--dmp-orange)}
.bar:nth-child(3) .col{background:var(--ai)}
.bar:nth-child(4) .col{background:var(--info)}
.bar:nth-child(5) .col{background:var(--accent)}
.bar .col em{position:absolute;top:-30px;left:50%;transform:translateX(-50%);font-style:normal;
  font-family:var(--fn);font-size:20px;font-weight:700;color:#fff;white-space:nowrap}
.bar s{text-decoration:none;font-size:12.5px;color:var(--muted)}
.cagr{display:inline-flex;align-items:center;gap:7px;padding:5px 13px;border-radius:100px;
  background:rgba(52,211,153,.14);border:1px solid rgba(52,211,153,.3);color:var(--green);
  font-size:12.5px;font-weight:700}

/* ---------- Exhibit Scope模块（局部硬编码卡片，不跟随上方变量） ----------
   想改这类卡片颜色，直接改下面三处：
     · .sn（左侧分类卡片）：背景 rgba(255,255,255,.8) / 描边 #c2cede / hover 渐变描边见 .sn::before
     · .scope-body>.card（右侧内容区）：同上写法
     · .chip（右侧标签，定义见上方 .chip 行）：同上写法
   渐变描边统一写法：linear-gradient(90deg,#f5a200,#e26b0f) 写在 ::before 伪元素里，
   用 mask 抠出 1px 边框以保留圆角。换颜色/方向改这两个色值即可。
------------------------------------------------------------ */
.scope{display:grid;grid-template-columns:300px 1fr;gap:26px;align-items:start}
.scope-nav{display:flex;flex-direction:column;gap:9px;position:sticky;top:120px}
.sn{display:flex;align-items:center;gap:13px;padding:15px 18px;border-radius:14px;
  border:1px solid #c2cede;background:rgba(255,255,255,.8);cursor:pointer;transition:.28s;text-align:left;
  position:relative}
.sn::before{content:"";position:absolute;inset:-1px;border-radius:15px;padding:1px;
  background:linear-gradient(90deg,#f5a200,#e26b0f);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .28s;pointer-events:none}
.sn:hover{background:rgba(255,255,255,.95);transform:translateX(4px)}
.sn:hover::before{opacity:1}
.sn.on{background:rgba(226,107,15,.10);
  border-color:rgba(226,107,15,.45);color:var(--dmp-orange)}
.sn .n{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto;
  font-family:var(--fn);font-weight:700;font-size:15px;background:rgba(234,85,61,.08);color:var(--wod-orange-red)}
.sn.on .n{background:var(--dmp-orange);color:#ffffff}
.sn b{font-size:15px;font-weight:700;display:block}
.sn s{text-decoration:none;font-size:11.5px;color:var(--muted);display:block}
.scope-body{min-height:420px}
.scope-body>.card{background:rgba(255,255,255,.8);border:1px solid #c2cede}
.scope-body>.card::after{background:linear-gradient(90deg,#f5a200,#e26b0f)}
.sgrp{margin-bottom:26px}
.sgrp h4{font-size:15px;color:var(--wod-orange-red);margin-bottom:12px;display:flex;align-items:center;gap:9px}
.sgrp h4::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--wod-orange-red)}
.scope-tip{margin-top:22px;padding:16px 20px;border-radius:14px;background:rgba(19,221,196,.07);
  border:1px solid rgba(19,221,196,.24);font-size:13.5px;color:#C2CEDE;display:flex;gap:11px}

/* ---------- diagnostic ---------- */
.diag{border:1px solid var(--line2);border-radius:26px;overflow:hidden;
  background:linear-gradient(160deg,rgba(226,107,15,.1),rgba(6,10,20,.8));backdrop-filter:blur(16px)}
.diag-head{padding:28px 34px;border-bottom:1px solid var(--line);display:flex;
  align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.steps{display:flex;gap:10px;align-items:center}
.stp{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--dim);font-weight:600}
.stp .b{width:26px;height:26px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;
  font-size:12px;font-family:var(--fn);transition:.3s}
.stp.on{color:#fff}
.stp.on .b{background:linear-gradient(135deg,var(--blue),var(--cyan));border-color:transparent;color:#ffffff;font-weight:700}
.stp.dn .b{background:var(--green);border-color:transparent;color:var(--wod-dark)}
.stp i{font-style:normal;color:var(--dim);opacity:.5}
.diag-body{padding:34px}
.dpane{display:none;animation:fade .4s ease}
.dpane.on{display:block}
.lvl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.lvl{display:block;width:100%;font:inherit;text-align:left;color:inherit;
  border:1px solid var(--line);border-radius:18px;padding:26px;cursor:pointer;transition:.32s;
  background:var(--panel);position:relative;overflow:hidden}
.lvl:hover{transform:translateY(-7px);border-color:var(--cta-coral);box-shadow:0 24px 50px -22px rgba(234,85,61,.35),0 0 0 1px rgba(234,85,61,.55)}
.lvl.on{border-color:var(--cta-coral);background:rgba(234,85,61,.10);box-shadow:0 0 0 3px rgba(234,85,61,.16)}
.lvl .no{font-family:var(--fn);font-size:44px;font-weight:700;color:rgba(var(--tint),.07);
  position:absolute;top:14px;right:22px;line-height:1;pointer-events:none}
.lvl .kd{display:inline-block;font-size:10.5px;letter-spacing:.14em;padding:3px 10px;border-radius:100px;
  background:var(--cta-coral);color:#fff;font-weight:800;margin-bottom:13px}
.lvl h4{font-size:18px;margin-bottom:8px;font-weight:800}
.lvl .sl{font-size:13px;color:var(--info);margin-bottom:10px;font-weight:600}
.lvl p{font-size:13px;color:var(--txt2);line-height:1.8}
.pain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pain{border:1px solid var(--line);border-radius:14px;padding:18px;cursor:pointer;transition:.28s;
  background:rgba(var(--tint),.03);display:flex;gap:13px;align-items:flex-start;text-align:left}
.pain:hover{border-color:var(--rose);background:rgba(251,113,133,.08);transform:translateY(-4px)}
.pain.on{border-color:var(--rose);background:rgba(251,113,133,.14);box-shadow:0 0 0 3px rgba(251,113,133,.1)}
.pain .ck{width:20px;height:20px;border-radius:6px;border:1.6px solid var(--line2);flex:0 0 auto;margin-top:2px;
  display:grid;place-items:center;font-size:11px;transition:.24s}
.pain.on .ck{background:var(--rose);border-color:var(--rose);color:#2A0710}
.pain b{display:block;font-size:14.5px;font-weight:700}
.pain s{display:block;text-decoration:none;font-size:12.5px;color:var(--muted);margin-top:4px;line-height:1.7}
.rx{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
.rx-c{border:1px solid var(--line);border-radius:18px;padding:26px;position:relative;overflow:hidden;background:var(--panel)}
.rx-c .no{font-family:var(--fn);font-size:44px;font-weight:700;color:rgba(var(--tint),.07);position:absolute;top:14px;right:22px;line-height:1;pointer-events:none}
.rx-c .kd{display:inline-block;font-size:10.5px;letter-spacing:.14em;padding:3px 10px;border-radius:100px;background:var(--cta-coral);color:#fff;font-weight:800;margin-bottom:13px}
.rx-c h4{font-size:18px;margin-bottom:8px;font-weight:800}
.rx-c .sl{font-size:13px;color:var(--info);margin-bottom:10px;font-weight:600}
.rx-c p{font-size:13px;color:var(--txt2);line-height:1.8}
.diag-foot{margin-top:26px;padding-top:24px;border-top:1px dashed var(--line2);display:flex;
  gap:14px;flex-wrap:wrap;align-items:center;justify-content:space-between}

/* ---------- dual value ---------- */
.dual{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.dual-c{border-radius:24px;padding:34px;border:1px solid var(--line);position:relative;overflow:hidden;
  transition:.34s;cursor:pointer}
.dual-c.ex{background:linear-gradient(160deg,rgba(226,107,15,.18),rgba(6,10,20,.6))}
.dual-c.vi{background:linear-gradient(160deg,rgba(19,221,196,.14),rgba(6,10,20,.6))}
.dual-c:hover{transform:translateY(-6px);border-color:var(--line2)}
.dual-c .hd{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.dual-c .hd .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:22px;
  background:rgba(var(--tint),.09)}
.dual-c h3{font-size:23px;color:var(--txt)}
.dual-c .sb{font-size:13px;color:var(--muted)}
.plist{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.plist.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pl{display:flex;gap:12px;padding:13px 15px;border-radius:12px;background:rgba(0,0,0,.28);
  border:1px solid transparent;transition:.24s;cursor:pointer;font-size:13.5px;align-items:flex-start}
.pl:hover{border-color:var(--line2);background:var(--inset);transform:translateX(4px)}
.pl.on{border-color:var(--cyan);background:rgba(226,107,15,.1)}
.pl .d{color:var(--cyan);font-weight:900;flex:0 0 auto}
.pl b{display:block;font-weight:700;color:#fff}
.pl s{text-decoration:none;color:var(--muted);font-size:12.5px;display:block;margin-top:3px}

/* ---------- event matrix ---------- */
.evt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ben-grid{grid-template-columns:repeat(2,1fr);max-width:920px;margin-inline:auto}
.evt{border:1px solid var(--line);border-radius:18px;padding:26px;cursor:pointer;transition:.32s;
  background:var(--panel);position:relative;overflow:hidden}
.evt:hover{transform:translateY(-7px);border-color:var(--cta-coral);box-shadow:0 24px 50px -22px rgba(234,85,61,.35),0 0 0 1px rgba(234,85,61,.55)}
.evt .no{font-family:var(--fn);font-size:44px;font-weight:700;color:rgba(var(--tint),.07);
  position:absolute;top:14px;right:22px;line-height:1}
.evt .kd{display:inline-block;font-size:10.5px;letter-spacing:.14em;padding:3px 10px;border-radius:100px;
  background:var(--cta-coral);color:#ffffff;font-weight:800;margin-bottom:13px}
.evt h4{font-size:18px;margin-bottom:8px}
.evt .sl{font-size:13px;color:var(--info);margin-bottom:12px;font-weight:600}
.evt p{font-size:13px;color:var(--txt2);line-height:1.8}
.evt .gain{max-height:0;overflow:hidden;transition:.42s cubic-bezier(.4,0,.2,1);opacity:0}
.evt.open .gain{max-height:340px;opacity:1;margin-top:16px}
.evt .gain ul{list-style:none;display:flex;flex-direction:column;gap:8px;
  padding-top:15px;border-top:1px dashed var(--line2)}
.evt .gain li{font-size:12.5px;color:var(--txt2);padding-left:19px;position:relative;line-height:1.7}
.evt .gain li::before{content:"▸";position:absolute;left:0;color:var(--info)}
.evt .more{margin-top:14px;font-size:12.5px;color:var(--info);font-weight:700;display:flex;align-items:center;gap:6px}
.evt.open .more .cv{transform:rotate(180deg)}
.evt .more .cv{transition:.3s;display:inline-block}

/* ---------- benefit calculator ---------- */
.calc{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.slider-wrap{margin:32px 0 10px}
.sl-val{display:flex;align-items:baseline;gap:10px;margin-bottom:18px}
.sl-val b{font-family:var(--fn);font-size:64px;font-weight:700;line-height:1;
  background:linear-gradient(96deg,#383993,#E26B0F);-webkit-background-clip:text;background-clip:text;color:transparent}
.sl-val s{text-decoration:none;font-size:18px;color:var(--muted)}
input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:6px;border-radius:100px;
  background:linear-gradient(90deg,var(--blue),var(--cyan)) no-repeat,rgba(var(--tint),.1);
  background-size:20% 100%;outline:none;cursor:pointer}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;
  background:var(--on);border:5px solid var(--cyan);cursor:grab;box-shadow:0 4px 16px rgba(226,107,15,.7)}
input[type=range]::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.12)}
.sl-marks{display:flex;justify-content:space-between;margin-top:11px;font-size:11.5px;color:var(--dim)}
.lead-out{border:1px solid rgba(52,211,153,.3);background:rgba(52,211,153,.08);border-radius:16px;
  padding:20px 24px;margin-top:24px;display:flex;align-items:center;gap:18px}
.lead-out .big{font-family:var(--fn);font-size:46px;font-weight:700;color:var(--green);line-height:1}
.lead-out p{font-size:13.5px;color:var(--txt2)}
.tiers{display:flex;flex-direction:column;gap:12px}
.tier{border:1px solid var(--line);border-radius:16px;padding:20px 22px;transition:.34s;opacity:.42;
  background:rgba(var(--tint),.025);position:relative}
.tier.unlock{opacity:1;border-color:rgba(52,211,153,.4);background:rgba(52,211,153,.07)}
.tier .hd{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:7px}
.tier b{font-size:15.5px;font-weight:800}
.tier .st{font-size:11px;padding:3px 10px;border-radius:100px;background:rgba(var(--tint),.09);color:var(--muted);font-weight:700}
.tier.unlock .st{background:var(--green);color:var(--wod-dark)}
.tier p{font-size:12.8px;color:var(--txt2);line-height:1.75}
.tier-bonus{margin-top:11px;font-size:12.5px;font-weight:700;color:var(--cyan);
  background:rgba(245,162,0,.08);border:1px solid rgba(245,162,0,.28);border-radius:10px;padding:7px 12px;display:inline-block}
.calc-reward{border:1px dashed rgba(245,162,0,.5);background:rgba(245,162,0,.06);border-radius:14px;
  padding:14px 18px;margin-top:18px;font-size:13px;color:var(--txt2)}
.calc-reward .cr-h{font-weight:700;color:var(--cyan);margin-bottom:8px;font-size:13px;letter-spacing:.03em}
.calc-reward .cr-item{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px dashed rgba(245,162,0,.18)}
.calc-reward .cr-item:last-of-type{border-bottom:none}
.calc-reward .cr-item b{color:var(--cyan);text-align:right}
.calc-reward .cr-total{margin-top:11px;padding-top:11px;border-top:1px solid rgba(245,162,0,.3);
  font-weight:800;font-size:15px;color:var(--txt);line-height:1.5}
.calc-reward .cr-total em{color:var(--green);font-style:normal}
.calc-reward .cr-total s{font-size:12px;color:var(--muted);font-weight:500}

/* ---------- marquee ---------- */
.mq{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);padding:6px 0}
.mq-t{display:flex;gap:14px;width:max-content;animation:mv 44s linear infinite}
.mq:hover .mq-t{animation-play-state:paused}
.mq.r .mq-t{animation-direction:reverse;animation-duration:52s}
@keyframes mv{to{transform:translateX(-50%)}}
.lg{padding:12px 22px;border:1px solid var(--line);border-radius:12px;background:rgba(var(--tint),.045);
  font-size:14px;font-weight:600;color:var(--txt2);white-space:nowrap;transition:.24s;display:inline-flex;align-items:center;justify-content:center;min-height:54px}
.lg img{height:34px;width:auto;max-width:170px;object-fit:contain;opacity:.92;transition:.24s;
  background:#fff;border-radius:6px;padding:3px 6px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.logo-matrix-wrap{margin-top:24px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 30px;box-shadow:0 10px 34px rgba(20,30,50,.06);overflow:hidden}
.ex-mq{display:flex;overflow:hidden;width:100%}
.ex-mq + .ex-mq{margin-top:18px}
.ex-mq-track{display:flex;width:max-content;animation:exScroll 42s linear infinite}
.ex-mq.rev .ex-mq-track{animation-direction:reverse}
.ex-mq:hover .ex-mq-track{animation-play-state:paused}
.ex-mq-group{display:flex;gap:20px;padding-right:20px;align-items:center;flex:0 0 auto}
.ex-logo{height:78px;width:auto;max-width:200px;object-fit:contain;background:#fff;border-radius:10px;padding:10px 16px;box-shadow:0 2px 8px rgba(20,30,60,.08);flex:0 0 auto}
@keyframes exScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ex-stat{display:flex;gap:26px;flex-wrap:wrap;margin-top:26px;font-size:13.5px;color:var(--txt2)}
.ex-stat b{color:var(--red);font-weight:800}
@media(max-width:820px){.logo-matrix-wrap{padding:16px 14px;border-radius:12px}.ex-logo{height:52px;padding:7px 11px}.ex-mq-track{gap:13px}.ex-mq-group{gap:13px;padding-right:13px}.ex-mq + .ex-mq{margin-top:12px}.ex-stat{gap:14px}}
.lg:hover{border-color:var(--cyan);color:#fff;background:rgba(226,107,15,.1)}
.lg:hover img{opacity:1;transform:scale(1.06)}

/* ---------- testimonials ---------- */
.tst{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tt{border:1px solid var(--line);border-radius:18px;padding:26px;background:rgba(var(--tint),.035);
  transition:.3s;position:relative}
.tt:hover{transform:translateY(-6px);border-color:rgba(234,85,61,.45);background:rgba(234,85,61,.05);box-shadow:0 24px 50px -22px rgba(234,85,61,.18)}
.tt .qm{font-family:Georgia,serif;font-size:52px;color:rgba(19,221,196,.45);line-height:.7;margin-bottom:10px}
.tt p{font-size:13.5px;color:var(--txt2);line-height:1.9}
.tt .who{margin-top:18px;padding-top:15px;border-top:1px dashed var(--line2);font-size:12.5px}
.tt .who b{display:block;color:#fff;font-weight:700}
.tt .who s{text-decoration:none;color:var(--muted)}

/* ---------- audience data ---------- */
.don{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.ring{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;
  position:relative;transition:1.4s}
.ring::before{content:"";position:absolute;inset:13px;border-radius:50%;background:#09112c}
.ring b{position:relative;font-family:var(--fn);font-size:34px;font-weight:700;color:#fff}

/* ---------- download center ---------- */
.dl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.dl{border:1px solid var(--line);border-radius:18px;padding:26px;cursor:pointer;transition:.32s;
  background:linear-gradient(160deg,rgba(var(--tint),.05),rgba(var(--tint),.015));position:relative;overflow:hidden}
.dl:hover{transform:translateY(-7px);border-color:rgba(234,85,61,.45);box-shadow:0 22px 46px -20px rgba(234,85,61,.35)}
.dl .lock{position:absolute;top:16px;right:16px;font-size:12px;color:var(--gold);
  background:rgba(19,221,196,.14);padding:3px 10px;border-radius:100px;font-weight:700}
.dl .ic{font-size:30px;margin-bottom:16px}
.dl b{display:block;font-size:16px;font-weight:800;margin-bottom:8px}
.dl s{display:block;text-decoration:none;font-size:12.5px;color:var(--muted);line-height:1.75}
.dl .act{margin-top:16px;font-size:13px;color:var(--gold);font-weight:700;display:flex;align-items:center;gap:7px}
.dl.got{border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.07)}
.dl.got .lock{background:rgba(52,211,153,.18);color:var(--green)}
.dl.got .act{color:var(--green)}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:300;background:rgba(2,5,12,.86);backdrop-filter:blur(14px);
  display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;transition:.34s}
.modal.on{opacity:1;visibility:visible}
.mbox{max-width:520px;width:100%;background:linear-gradient(160deg,#09112c,#09112c);
  border:1px solid var(--line2);border-radius:24px;padding:36px;box-shadow:var(--shadow);
  transform:translateY(22px) scale(.97);transition:.4s cubic-bezier(.2,.9,.3,1);max-height:90vh;overflow:auto}
.modal.on .mbox{transform:none}
.mbox h3{font-size:23px}
.mbox .msub{color:var(--txt2);font-size:13.5px;margin-top:10px;line-height:1.8}
.fld{margin-top:16px}
.fld label{display:block;font-size:12.5px;color:var(--txt2);margin-bottom:7px;font-weight:600}
.fld label em{color:var(--rose);font-style:normal}
.fld input,.fld select{width:100%;padding:13px 16px;border-radius:12px;border:1px solid var(--line2);
  background:var(--field);color:var(--on);font-size:14px;transition:.24s;outline:none}
.fld input:focus,.fld select:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(226,107,15,.14)}
.fld select option{background:#09112c}

/* business-registry verification badge & suggestion dropdown */
.ic-badge{display:inline-flex;align-items:center;gap:6px;margin-top:7px;font-size:11.5px;color:var(--dim)}
.ic-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--dim);flex:0 0 auto}
.ic-badge.loading{color:var(--cyan)}
.ic-badge.loading .dot{background:var(--cyan);animation:pulse 1s infinite}
.ic-badge.ok{color:#35c08b}
.ic-badge.ok .dot{background:#35c08b}
.ic-badge.warn{color:var(--dmp-orange)}
.ic-badge.warn .dot{background:var(--dmp-orange)}
.ic-suggest{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:60;background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.16);max-height:248px;overflow:auto;display:none}
.ic-suggest.on{display:block}
.ic-suggest .it{padding:10px 13px;cursor:pointer;border-bottom:1px solid #f0f0f0;font-size:13px;color:#1d2330;line-height:1.35}
.ic-suggest .it:last-child{border-bottom:0}
.ic-suggest .it:hover{background:#eef7fb}
.ic-suggest .it .cn{font-weight:600}
.ic-suggest .it .cc{font-size:11px;color:#8a93a3;margin-top:3px}
.ic-suggest .it .cc b{color:var(--cyan)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mnote{margin-top:16px;font-size:11.5px;color:var(--dim);line-height:1.7;display:flex;gap:8px}
.mclose{position:absolute;top:18px;right:20px;background:none;border:none;color:var(--muted);
  font-size:24px;cursor:pointer;line-height:1}
.mclose:hover{color:#fff}
/* ------------------------------------------------- Cookie preference banner & panel */
.ck-banner{position:fixed;left:0;right:0;bottom:0;z-index:9998;
  background:rgba(9,17,44,.97);backdrop-filter:blur(14px);
  border-top:1px solid var(--line2);padding:22px 24px;
  box-shadow:0 -12px 40px rgba(0,0,0,.45);display:none}
.ck-banner.on{display:block}
.ck-inner{max-width:1140px;margin:0 auto;display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.ck-inner p{margin:0;color:var(--txt2);font-size:13px;line-height:1.8;flex:1;min-width:260px}
.ck-inner p a{color:var(--cyan);text-decoration:underline}
.ck-btns{display:flex;gap:12px;flex-wrap:wrap}
.ck-sec .ck-row{display:flex;align-items:flex-start;gap:14px;padding:15px 0;border-bottom:1px solid var(--line2)}
.ck-sec .ck-row:last-child{border-bottom:none}
.ck-row .ck-text{flex:1}
.ck-row h4{font-size:14.5px;margin:0 0 4px;color:var(--on)}
.ck-row p{font-size:12px;color:var(--txt2);line-height:1.6;margin:0}
.ck-toggle{flex:0 0 auto;position:relative;width:44px;height:24px;margin-top:2px}
.ck-toggle input{position:absolute;opacity:0;width:0;height:0}
.ck-toggle .sw{position:absolute;inset:0;background:var(--line2);border-radius:24px;transition:.25s;cursor:pointer}
.ck-toggle .sw:before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.25s}
.ck-toggle input:checked+.sw{background:var(--cyan)}
.ck-toggle input:checked+.sw:before{transform:translateX(20px)}
.ck-toggle input:disabled+.sw{opacity:.5;cursor:not-allowed}
.ck-actions{display:flex;gap:12px;margin-top:22px;flex-wrap:wrap}
.ck-saved{margin-top:14px;font-size:12.5px;color:var(--success);text-align:center;min-height:16px}
.prefill{background:rgba(226,107,15,.09);border:1px solid rgba(226,107,15,.28);border-radius:12px;
  padding:13px 16px;margin-top:18px;font-size:12.5px;color:#383993;line-height:1.75}
.prefill b{color:#fff}

/* ---------- HUD ---------- */
.hud-btn{position:fixed;right:22px;bottom:104px;z-index:150;display:flex;align-items:center;gap:9px;
  padding:11px 18px;border-radius:100px;border:1px solid rgba(234,85,61,.4);
  background:rgba(8,16,30,.94);backdrop-filter:blur(16px);cursor:pointer;
  box-shadow:0 14px 40px -14px rgba(0,0,0,.9);transition:.3s;font-size:13px;font-weight:700;color:var(--txt)}
.hud-btn:hover{border-color:var(--ai);transform:translateY(-2px)}
.hud-btn .cnt{background:var(--ai);color:var(--wod-dark);border-radius:100px;padding:1px 9px;font-size:11.5px;
  font-family:var(--fn);font-weight:700}
.hud{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:92vw;z-index:180;
  background:linear-gradient(180deg,#0A1220,#09112c);border-left:1px solid var(--line2);
  transform:translateX(102%);transition:.44s cubic-bezier(.2,.9,.3,1);display:flex;flex-direction:column;
  box-shadow:-24px 0 70px -20px rgba(0,0,0,.9)}
.hud.on{transform:none}
.hud-h{padding:22px 24px;border-bottom:1px solid var(--line);display:flex;
  align-items:flex-start;justify-content:space-between;gap:14px}
.hud-h b{font-size:16.5px;display:block;font-weight:800}
.hud-h s{text-decoration:none;font-size:11.5px;color:var(--muted);display:block;margin-top:5px;line-height:1.6}
.hud-h button{background:none;border:none;color:var(--muted);font-size:22px;cursor:pointer;line-height:1}
.hud-b{flex:1;overflow-y:auto;padding:22px 24px}
.hblk{margin-bottom:24px}
.hblk .t{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);
  font-weight:800;margin-bottom:11px;display:flex;align-items:center;gap:8px}
.hblk .t::after{content:"";flex:1;height:1px;background:var(--line)}
.kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:13px;border-bottom:1px dashed rgba(var(--tint),.05)}
.kv s{text-decoration:none;color:var(--muted)}
.kv b{color:#fff;font-weight:700;text-align:right}
.kv b.cy{color:var(--cyan)}
.kv b.gr{color:var(--green)}
.kv b.go{color:var(--gold)}
.htags{display:flex;flex-wrap:wrap;gap:7px;min-height:34px}
.htag{font-size:11.5px;padding:5px 11px;border-radius:100px;background:rgba(245,162,0,.14);
  border:1px solid rgba(245,162,0,.3);color:var(--dmp-amber);animation:pop .34s cubic-bezier(.2,1.4,.4,1)}
.htag.role{background:rgba(245,162,0,.16);border-color:rgba(245,162,0,.4);color:var(--dmp-amber)}
.htag.lvl{background:rgba(19,221,196,.16);border-color:rgba(19,221,196,.36);color:var(--ai)}
.htag.pain{background:rgba(193,71,140,.14);border-color:rgba(193,71,140,.32);color:var(--accent)}
@keyframes pop{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
.hempty{font-size:12.5px;color:var(--dim);font-style:italic}
/* AI 推断区块 */
.aib{display:inline-block;font-size:10px;line-height:1;padding:3px 7px;border-radius:100px;font-weight:800;
  letter-spacing:.05em;background:linear-gradient(96deg,#E26B0F,#13DDC4);color:#fff;vertical-align:middle;margin-left:6px;
  box-shadow:0 2px 10px -3px rgba(226,107,15,.6)}
.aitags{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}
.ai-tag{font-size:11.5px;padding:5px 11px;border-radius:100px;background:rgba(245,162,0,.14);
  border:1px solid rgba(245,162,0,.34);color:#C2CEDE;animation:pop .34s cubic-bezier(.2,1.4,.4,1)}
.aisum{margin-top:12px;font-size:12.5px;line-height:1.75;color:var(--txt2);
  background:rgba(var(--tint),.04);border:1px solid var(--line);border-radius:12px;padding:11px 13px}
.ainext{margin-top:9px;font-size:12px;line-height:1.7;color:#383993}
.ainext b{color:#fff}
.ainferring{font-size:12px;color:var(--dim);font-style:italic}
.score-bar{height:8px;border-radius:100px;background:rgba(var(--tint),.09);overflow:hidden;margin-top:10px}
.score-bar i{display:block;height:100%;border-radius:100px;transition:1s cubic-bezier(.2,.9,.3,1);
  background:linear-gradient(90deg,var(--dmp-orange),var(--dmp-amber))}
.stage{display:flex;gap:6px;margin-top:12px}
.sg{flex:1;text-align:center;padding:9px 4px;border-radius:10px;border:1px solid var(--line);
  font-size:11px;color:var(--dim);transition:.34s;background:rgba(var(--tint),.02)}
.sg.on{background:linear-gradient(135deg,var(--blue),var(--cyan));color:#ffffff;border-color:transparent;font-weight:800}
.sg.done{background:rgba(52,211,153,.16);border-color:rgba(52,211,153,.35);color:var(--green);font-weight:700}
.jsonv{background:#04070F;border:1px solid var(--line);border-radius:12px;padding:15px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;line-height:1.75;
  color:#383993;overflow-x:auto;white-space:pre-wrap;word-break:break-all;max-height:250px;overflow-y:auto}
.jsonv .k{color:#383993}.jsonv .s{color:#C2CEDE}.jsonv .n{color:#34D399}
.hud-f{padding:16px 24px;border-top:1px solid var(--line);display:flex;gap:10px}
.hud-f .btn{flex:1;font-size:12.5px;padding:11px 12px}
.evlog{max-height:190px;overflow-y:auto;display:flex;flex-direction:column;gap:6px}
.ev{font-size:11.5px;color:var(--txt2);padding:8px 11px;border-radius:9px;background:rgba(var(--tint),.035);
  border-left:2px solid var(--cyan);display:flex;justify-content:space-between;gap:10px;animation:slid .3s ease}
.ev s{text-decoration:none;color:var(--dim);font-family:var(--fn);flex:0 0 auto}
@keyframes slid{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

/* ---------- toast ---------- */
.toasts{position:fixed;right:22px;bottom:172px;z-index:190;display:flex;flex-direction:column;gap:9px;align-items:flex-end;pointer-events:none}
.toast{display:flex;align-items:center;gap:10px;padding:11px 18px;border-radius:100px;
  background:rgba(8,18,32,.96);border:1px solid rgba(226,107,15,.42);backdrop-filter:blur(14px);
  font-size:12.5px;font-weight:700;color:#383993;box-shadow:0 14px 36px -12px rgba(0,0,0,.9);
  animation:tin .4s cubic-bezier(.2,1.3,.4,1)}
.toast.gd{border-color:rgba(19,221,196,.42);color:#C2CEDE}
.toast.gr{border-color:rgba(52,211,153,.45);color:#8AEFC4}
@keyframes tin{from{opacity:0;transform:translateX(50px) scale(.9)}to{opacity:1;transform:none}}
.toast.out{animation:tout .3s forwards}
@keyframes tout{to{opacity:0;transform:translateX(50px) scale(.9)}}

/* ---------- AI chat ---------- */
.chat-fab{position:fixed;right:22px;bottom:24px;z-index:150;width:64px;height:64px;border-radius:50%;
  background:var(--cta-coral);border:none;cursor:pointer;
  display:grid;place-items:center;font-size:26px;box-shadow:0 16px 42px -12px rgba(234,85,61,.8);
  transition:.32s}
.chat-fab:hover{transform:scale(1.08) translateY(-3px);box-shadow:0 20px 50px -12px rgba(234,85,61,.85)}
.chat-fab .bdg{position:absolute;top:-3px;right:-3px;background:var(--rose);color:#fff;
  border-radius:100px;font-size:10.5px;padding:2px 7px;font-weight:800;border:2px solid var(--ink)}
.chat-fab .rip{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.7);
  animation:rip 2.4s ease-out infinite}
@keyframes rip{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.7);opacity:0}}
.chat{position:fixed;right:22px;bottom:100px;z-index:160;width:390px;max-width:92vw;height:560px;max-height:74vh;
  background:linear-gradient(180deg,#0B1524,#09112c);border:1px solid var(--line2);border-radius:22px;
  display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 70px -20px rgba(0,0,0,.92);
  opacity:0;visibility:hidden;transform:translateY(22px) scale(.96);transition:.38s cubic-bezier(.2,.9,.3,1)}
.chat.on{opacity:1;visibility:visible;transform:none}
.chat-h{padding:17px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;
  background:linear-gradient(96deg,rgba(226,107,15,.18),transparent)}
.chat-h .av{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--blue),var(--cyan));
  display:grid;place-items:center;font-size:19px;flex:0 0 auto}
.chat-h b{display:block;font-size:14.5px;font-weight:800}
.chat-h s{display:block;text-decoration:none;font-size:11.5px;color:var(--green);display:flex;align-items:center;gap:6px}
.chat-h button{margin-left:auto;background:none;border:none;color:var(--muted);font-size:21px;cursor:pointer}
.chat-b{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:14px}
.msg{max-width:86%;padding:12px 16px;border-radius:16px;font-size:13.5px;line-height:1.8;animation:slid .34s ease}
.msg.ai{background:rgba(var(--tint),.06);border:1px solid var(--line);border-bottom-left-radius:5px;align-self:flex-start}
.msg.me{background:linear-gradient(96deg,var(--blue),var(--cyan));color:#ffffff;
  border-bottom-right-radius:5px;align-self:flex-end;font-weight:600}
.msg.sys{align-self:center;background:rgba(19,221,196,.1);border:1px dashed rgba(19,221,196,.3);
  color:#C2CEDE;font-size:11.5px;text-align:center;border-radius:100px;padding:6px 14px}
.qr{display:flex;flex-wrap:wrap;gap:8px;padding:0 20px 14px}
.qr button{font-size:12px;padding:7px 14px;border-radius:100px;border:1px solid rgba(226,107,15,.32);
  background:rgba(226,107,15,.08);color:#383993;cursor:pointer;transition:.22s}
.qr button:hover{background:rgba(226,107,15,.2);transform:translateY(-2px)}
.chat-i{padding:14px 16px;border-top:1px solid var(--line);display:flex;gap:9px}
.chat-i input{flex:1;padding:11px 15px;border-radius:100px;border:1px solid var(--line2);
  background:var(--field);color:var(--on);font-size:13.5px;outline:none}
.chat-i input:focus{border-color:var(--cyan)}
.chat-i button{width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;
  background:linear-gradient(135deg,var(--blue),var(--cyan));font-size:16px}
.typing{display:flex;gap:4px;padding:14px 16px}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:tp 1.3s infinite}
.typing i:nth-child(2){animation-delay:.18s}.typing i:nth-child(3){animation-delay:.36s}
@keyframes tp{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-5px)}}

/* ---------- footer ---------- */
footer{background:#03060D;border-top:1px solid var(--line);padding:64px 0 30px;position:relative;z-index:2}
.f-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr;gap:34px}
.f-col h5{font-size:13px;font-weight:800;margin-bottom:16px;color:#fff;letter-spacing:.03em}
.f-col a,.f-col p{display:block;font-size:13px;color:var(--muted);padding:5px 0;transition:.2s;line-height:1.7}
.f-col a:hover{color:var(--cyan);transform:translateX(3px)}
.f-bot{margin-top:46px;padding-top:24px;border-top:1px solid var(--line);display:flex;
  justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--dim)}
.qrs{display:flex;gap:12px;margin-top:14px}
.qrb{width:74px;text-align:center}
.qrb .box{width:74px;height:74px;border-radius:11px;background:rgba(var(--tint),.07);
  border:1px solid var(--line);display:grid;place-items:center;font-size:24px}
.qrb s{text-decoration:none;font-size:10.5px;color:var(--dim);display:block;margin-top:7px}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(34px);transition:.85s cubic-bezier(.2,.9,.3,1)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.09s}.rv.d2{transition-delay:.18s}.rv.d3{transition-delay:.27s}
.rv.d4{transition-delay:.36s}.rv.d5{transition-delay:.45s}.rv.d6{transition-delay:.54s}

/* ---------- dev annotation ---------- */
.devnote{border:1px dashed rgba(139,92,246,.4);background:rgba(139,92,246,.07);border-radius:14px;
  padding:15px 19px;font-size:12.5px;color:#C1478C;line-height:1.8;display:flex;gap:11px;margin-top:20px}
.devnote code{background:var(--inset);padding:1px 7px;border-radius:5px;font-size:11.5px;color:#E8EEF6}

/* ---------- responsive ---------- */
@media(max-width:1200px){
  .menu>li>a{padding:10px 9px;font-size:13.2px}
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .scope{grid-template-columns:1fr}
  .scope-nav{flex-direction:row;overflow-x:auto;position:static;padding-bottom:6px}
  .sn{min-width:200px}
}
@media(max-width:980px){
  .g4,.dl-grid,.roles,.lvl-grid{grid-template-columns:repeat(2,1fr)}
  .g3,.evt-grid,.tst,.pain-grid,.don{grid-template-columns:repeat(2,1fr)}
  .calc,.dual,.driver,.mkt,.rx{grid-template-columns:1fr}
  .f-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .wrap{padding:0 20px}
  section{padding:36px 0}
  .menu{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;
    background:rgba(6,11,21,.99);border-bottom:1px solid var(--line2);padding:14px;gap:3px;
    max-height:74vh;overflow-y:auto}
  .menu.open{display:flex}
  .menu>li{width:100%}.menu>li>a{padding:13px 16px}
  .dd{position:static;transform:none;opacity:1;visibility:visible;background:transparent;border:none;
    box-shadow:none;padding:0 0 8px 16px;min-width:0}
  .burger{display:block}
  .nav-cta .btn:not(.keep){display:none}
  .util .util-l{display:none}
  .g2,.g3,.g4,.evt-grid,.tst,.pain-grid,.dl-grid,.roles,.lvl-grid,.don{grid-template-columns:1fr}
  .plist.grid3{grid-template-columns:1fr}
  .f-grid{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,1fr)}
  .chat{right:12px;left:12px;width:auto;bottom:92px}
  .hud-btn{right:14px;bottom:96px;padding:9px 14px;font-size:12px}
  .chat-fab{right:14px;bottom:20px;width:56px;height:56px;font-size:22px}
  .toasts{right:14px;left:14px;bottom:160px;align-items:stretch}
  .gate-box{padding:28px 22px}
  .diag-body{padding:22px}
  .diag-head{padding:20px 22px}
  .steps{font-size:11px}
  .identity-sel .lbl{display:none}
  .identity-sel .opt{padding:3px 8px;font-size:11px}
}

/* ============ 亮色主题（白底 · 像 macOS Light mode） ============ */
.theme-sw{display:flex;gap:2px;align-items:center;background:rgba(var(--tint),.06);border:1px solid var(--line);border-radius:100px;padding:2px}
.theme-sw button{width:30px;height:28px;border:none;background:none;cursor:pointer;border-radius:100px;font-size:14px;line-height:1;display:grid;place-items:center;opacity:.5;transition:.2s;color:var(--on)}
.theme-sw button:hover{opacity:1;background:rgba(var(--tint),.1)}
.theme-sw button.on{opacity:1;background:var(--red);color:#fff;box-shadow:0 2px 8px rgba(226,107,15,.4)}
[data-theme="light"]{
  --tint:9,17,44;
  --surf:255,255,255;
  --on:#09112c;
  --field:rgba(9,17,44,.05);
  --inset:rgba(9,17,44,.05);
  --ink:#FFFFFF;
  --txt:#09112c;
  --txt2:#273354;
  --muted:#999999;
  --dim:#999999;
  --line:#D9D9D9;
  --line2:rgba(35,24,21,.15);
  --ink2:#FAFAFA;
  --panel:#FFFFFF;
  --panel2:#FAFAFA;
  --shadow:0 24px 60px -22px rgba(9,17,44,.12);
  --glow:0 0 0 1px rgba(234,85,61,.22),0 12px 40px -10px rgba(234,85,61,.22);
}
[data-theme="light"] .gate{background:rgba(244,246,250,.95)}
[data-theme="light"] .modal{background:rgba(244,246,250,.95)}
[data-theme="light"] footer{background:#F4F6FA}
[data-theme="light"] .dual-c.ex{background:linear-gradient(160deg,rgba(226,107,15,.07),rgba(255,255,255,.96))}
[data-theme="light"] .dual-c.vi{background:linear-gradient(160deg,rgba(19,221,196,.1),rgba(255,255,255,.96))}
[data-theme="light"] .ring::before{background:#E7EBF2}
[data-theme="light"] .fld select option{background:#FFFFFF;color:var(--wod-dark)}
[data-theme="light"] .jsonv{background:#FFFFFF;border-color:rgba(17,22,34,.12)}
[data-theme="light"] .orb{opacity:.2}
[data-theme="light"] .bg-fx .grid{background-image:linear-gradient(rgba(var(--tint),.06) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--tint),.06) 1px,transparent 1px)}
[data-theme="light"] [style*="rgba(6,10,20"]{background:linear-gradient(160deg,rgba(17,22,34,.04),rgba(255,255,255,.92))!important}
[data-theme="light"] [style*="color:#fff"]{color:var(--on)!important}
[data-theme="light"] [style*="color:#ffffff"]{color:var(--on)!important}
[data-theme="light"] .hp-wod{color:#fff!important}


/* 浮层面板在亮色下翻白（避免突兀 + 文字隐形） */
[data-theme="light"] .hud-btn{background:rgba(8,16,30,.96);box-shadow:0 14px 40px -14px rgba(0,0,0,.9);border-color:rgba(234,85,61,.4)}
[data-theme="light"] .hud{background:linear-gradient(180deg,#0A1220,#09112c);border-left:1px solid var(--line2);box-shadow:-24px 0 70px -20px rgba(0,0,0,.9)}
[data-theme="light"] .chat{background:linear-gradient(180deg,#FFFFFF,#F2F4F8);box-shadow:0 30px 70px -20px rgba(17,22,34,.2)}
[data-theme="light"] .gate-box{background:linear-gradient(160deg,#FFFFFF,#F1F4F8);border-color:rgba(17,22,34,.12)}
[data-theme="light"] .mbox{background:linear-gradient(160deg,#FFFFFF,#F1F4F8);border-color:rgba(17,22,34,.12)}
[data-theme="light"] .toast{background:rgba(255,255,255,.97);border-color:rgba(226,107,15,.3);color:var(--on);box-shadow:0 14px 36px -12px rgba(17,22,34,.25)}
[data-theme="light"] .toast.gd{color:#21D382}
[data-theme="light"] .toast.gr{color:#158a52}
[data-theme="light"] .toast.gr{color:#0E7A52}

/* Light mode下，原暗色系白色文字统一改为深色（有彩色渐变底的按钮/标签除外） */
[data-theme="light"] .hm b{color:var(--on)!important}
[data-theme="light"] .cd-c b{color:var(--blue)!important}
[data-theme="light"] .st b{color:var(--on)!important}
[data-theme="light"] .f-col h5{color:var(--on)!important}
[data-theme="light"] .pl b{color:var(--on)!important}
[data-theme="light"] .kv b{color:var(--on)!important}
[data-theme="light"] .ring b{color:var(--on)!important}
[data-theme="light"] .tt .who b{color:var(--on)!important}
[data-theme="light"] .prefill b{color:var(--on)!important}
[data-theme="light"] .ainext b{color:var(--on)!important}
[data-theme="light"] .sg.on{color:var(--on)!important;text-shadow:none}
[data-theme="light"] .tab.on{color:#fff!important}
[data-theme="light"] .sn.on .n{color:#fff!important}
[data-theme="light"] .stp.on{color:var(--on)!important}
[data-theme="light"] .stp.on .b{color:#fff!important}
[data-theme="light"] .btn-p{color:#fff!important}
[data-theme="light"] .lang b.on{color:#fff!important}
/* Light mode: diagnostic area turns white, warm-orange palette (aligned with Chinese) */
[data-theme="light"] .diag{background:linear-gradient(160deg,rgba(245,162,0,.08),rgba(255,255,255,.98));border-color:rgba(226,107,15,.25)}
[data-theme="light"] .diag-head{border-bottom-color:rgba(226,107,15,.2)}
[data-theme="light"] .stp.on .b{background:linear-gradient(135deg,var(--dmp-amber),var(--dmp-orange));border-color:transparent}
[data-theme="light"] .pain{background:#FFFFFF;border-color:rgba(226,107,15,.2)}
[data-theme="light"] .pain:hover{border-color:var(--cta-coral);box-shadow:0 24px 50px -22px rgba(234,85,61,.25),0 0 0 1px rgba(234,85,61,.35)}
[data-theme="light"] .pain.on{border-color:var(--cta-coral);background:rgba(234,85,61,.08);box-shadow:0 0 0 3px rgba(234,85,61,.12)}
[data-theme="light"] .rx-c{background:#FFFFFF;border-color:rgba(226,107,15,.2)}
[data-theme="light"] .diag-foot{border-top-color:rgba(226,107,15,.25)}
[data-theme="light"] .menu>li>a:hover{color:var(--txt)!important}[data-theme="light"] .menu>li.act>a{color:var(--dmp-orange)!important}
[data-theme="light"] .dd a:hover{color:var(--wod-primary)!important;background:rgba(56,57,147,.06)}
[data-theme="light"] .msg.me{color:#fff!important}
[data-theme="light"] .chat-fab .bdg{color:#fff!important}
[data-theme="light"] .lg:hover{color:#fff!important}

/* 角色高亮：被 reorder() 标记的区块显示激活边框 */
[data-role-highlight="active"]{
  box-shadow: 0 0 0 2px var(--cyan), 0 0 20px rgba(0,200,255,.12);
  border-radius: 12px;
  transition: box-shadow .4s;
}
[data-role-highlight="active"] .sec-title,
[data-role-highlight="active"] h2{color:var(--cyan)!important;}

/* ===== 首屏沉浸式背景视频（原视频 00:15–00:50 轻量循环） ===== */
.hero{background:#09112c}

.hero-bg{position:absolute;inset:0;z-index:0;background:#09112c;overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero-dim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,12,24,.60) 0%,rgba(8,12,24,.42) 32%,rgba(8,12,24,.42) 68%,rgba(8,12,24,.64) 100%);pointer-events:none}
.hero .wrap{position:relative;z-index:2}
@media (prefers-reduced-motion:reduce){.hero-video{display:none}}

/* 视频之上文字清晰：浅色文字 + 半透明玻璃色块（高优先级覆盖浅色主题强制深色） */
header.hero h1{color:#fff!important;text-shadow:0 1px 6px rgba(0,0,0,.25)}
header.hero h1 .l2:not(.grad){color:#fff!important}
header.hero .hero-invite{color:#fff!important;text-shadow:0 1px 6px rgba(0,0,0,.25)}
header.hero .hero-invite .grad-gold{background:var(--dmp-yellow);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
header.hero .hero-invite .sm{background:var(--dmp-yellow);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
header.hero .hm{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.24);backdrop-filter:blur(6px)}
header.hero .hm b{color:#fff!important}
header.hero .hm .ic{filter:brightness(1.5)}
header.hero .st{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(6px);box-shadow:0 6px 22px rgba(0,0,0,.18)}
header.hero .st b{color:#fff!important}
header.hero .st b+i{color:#fff!important}
header.hero .st s{color:rgba(255,255,255,.72)!important}
header.hero [data-cms="stats_note"]{color:rgba(255,255,255,.72)!important}
header.hero .rolebar{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px)}
header.hero .rolebar span{color:rgba(255,255,255,.78)!important}
header.hero .rolebar button{background:#E26B0F;color:#fff;border-color:#E26B0F}


/* ===== 站点专属追加（ref_new.css 未含） ===== */
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.tabpane{display:none;animation:fade .45s ease}
.tabpane.on{display:block}

/* ===== 「Five driving forces resonate in synergy」切换标签：白底橙边胶囊按钮（与中文对齐） ===== */
#about .tabs{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:6px}
#about .tab{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:100px;
  background:#FFFFFF;color:var(--dmp-orange);border:1.5px solid var(--dmp-orange);
  font-size:15px;font-weight:700;cursor:pointer;transition:.25s;font-family:inherit}
#about .tab:hover{border-color:var(--wod-orange-red);color:var(--wod-orange-red);background:rgba(226,107,15,.06)}
#about .tab.on{background:linear-gradient(96deg,var(--wod-orange-red),#E0585C);border-color:transparent;color:#fff!important;
  box-shadow:0 10px 26px -10px rgba(187,37,41,.55)}

/* ---- WOD intro video (transparent background, aligned with site) ---- */
.promo-sec{background:transparent;padding:52px 0 64px}
.promo-sec .sec-head{text-align:left;margin-bottom:36px}
.promo-sec .sec-head .eyebrow{color:var(--cyan)}
.promo-sec .sec-head .sec-title{color:var(--txt)}
.promo-sec .sec-head .sec-sub{color:var(--txt2)}
.promo-wrap{width:100%;margin:0 auto}
.promo-frame{position:relative;border-radius:18px;overflow:hidden;
  background:#000 url('assets/wod-promo-poster.jpg') center/cover no-repeat;box-shadow:0 30px 70px -30px rgba(0,0,0,.45);border:1px solid var(--line);aspect-ratio:16/9}
.promo-frame video{width:100%;height:100%;display:block;object-fit:cover;background:transparent}
.play-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;border-radius:18px;transition:opacity .25s;background:rgba(0,0,0,.12)}
.play-overlay.hidden{opacity:0;pointer-events:none}
.play-btn{width:84px;height:84px;border-radius:50%;background:rgba(255,255,255,.94);border:none;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 44px rgba(0,0,0,.35);cursor:pointer;transition:transform .18s}
.play-btn:hover{transform:scale(1.07)}
.play-btn svg{width:30px;height:30px;margin-left:3px}
.play-btn svg path{fill:#09112c}
.promo-cap{display:flex;justify-content:space-between;align-items:center;gap:18px;
  margin-top:20px;flex-wrap:wrap}
.promo-cap p{color:var(--txt2);font-size:13.5px;margin:0;line-height:1.7;flex:1;min-width:240px}
@media(max-width:820px){.promo-sec{padding:40px 0 48px}.promo-frame{border-radius:12px}.play-btn{width:68px;height:68px}.play-btn svg{width:24px;height:24px}}
/* ---------- audience data (aligned with Chinese version) ---------- */
/* —— 专业观众：上方卡片 ↔ 下方 01/02/03 互动高亮（与中文站一致） —— */
#audCard1,#audCard2,#audCard3{cursor:pointer;transition:transform .2s,box-shadow .2s,outline-color .25s}
#audCard1:hover,#audCard2:hover,#audCard3:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.28)}
#audCard1:focus,#audCard2:focus,#audCard3:focus{outline:none}
.aud-card-sel{outline:3px solid var(--dmp-orange);outline-offset:4px;box-shadow:0 12px 28px rgba(0,0,0,.32)!important}
.aud-hl{position:relative;border-radius:16px;outline:3px solid var(--red);outline-offset:6px;box-shadow:0 0 0 7px rgba(234,85,61,.12),0 14px 34px rgba(0,0,0,.3);transition:outline-color .3s,box-shadow .3s}
@media(prefers-reduced-motion:reduce){.aud-hl{scroll-behavior:auto}}
.ad-section{padding:35px 0 80px;color:#1a1a1a;background:#fff}
.ad-section .wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.ad-grid2{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch}
.ad-card{background:transparent;border-radius:18px;padding:26px;box-shadow:none;border:1px solid rgba(0,0,0,.06)}
.ad-col-right{height:100%}
#audPt3{flex:1;display:flex;flex-direction:column;justify-content:center}
.ad-head{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.ad-badge{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;border-radius:10px;background:#E26B0F;color:#fff;font-weight:800;font-size:18px;font-family:var(--fn)}
.ad-title{font-size:14px;color:#E26B0F;font-weight:700}
.ad-title b{color:#E26B0F;font-size:17px}
.ad-desc{color:#4a4a4a;font-size:13.5px;line-height:1.7}
.ad-desc b{color:#E26B0F}
.ad-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}
.ad-stat{background:transparent;border-radius:14px;padding:18px 20px;border:1px solid rgba(0,0,0,.08)}
.ad-stat-label{font-size:13px;color:#666;margin-bottom:6px}
.ad-stat-num{font-size:28px;font-weight:700;font-family:var(--fn);color:#E26B0F}
.ad-stat-num.blue{color:#2EA7FF}
.ad-hlbox{background:transparent;border-radius:14px;padding:18px 22px;border:1px solid rgba(0,0,0,.08);text-align:center;margin-bottom:16px}
.ad-hlbox .big{color:#2EA7FF;font-size:22px;font-weight:700;font-family:var(--fn)}
.ad-hlbox b{color:#1a1a1a}
.ad-tags{display:flex;flex-wrap:wrap;gap:8px;font-size:12.5px}
.ad-tag{background:transparent;border:1px solid rgba(226,107,15,.35);color:#E26B0F;padding:4px 10px;border-radius:6px;font-weight:500}
.ad-region{background:transparent;border-radius:16px;padding:22px;border:1px solid rgba(0,0,0,.08)}
.ad-region-title{font-size:15px;font-weight:700;margin-bottom:14px;color:#1a1a1a}
.ad-region-center{text-align:center;margin-bottom:16px;color:#666;font-size:13px}
.ad-region-center span{color:#2EA7FF;font-size:26px;font-weight:700;font-family:var(--fn)}
.ad-region-bars{display:flex;align-items:end;justify-content:center;gap:16px;height:90px}
.ad-region-bar{text-align:center;min-width:34px}
.ad-region-bar .bar{width:34px;background:linear-gradient(to top,#2EA7FF,#3583BE);border-radius:6px 6px 0 0;margin:0 auto 6px}
.ad-region-bar .pct{color:#2EA7FF;font-weight:700;font-family:var(--fn)}
.ad-region-bar .name{font-size:11px;color:#666}
#audPt1.ad-card{background:transparent;border:1px solid rgba(0,0,0,.06);box-shadow:none}
#audPt1 .ad-stat{background:transparent;border:none;border-radius:0;padding:16px 18px;box-shadow:none}
#audPt1 .ad-hlbox{background:transparent;border-color:rgba(0,0,0,.08)}
#audPt1 .ad-region{background:transparent;border-color:rgba(0,0,0,.08)}
#audPt1 .ad-top10{background:transparent;border:none;box-shadow:none;padding:0}
#audPt1 .ad-top10 > b{font-size:15px;color:#1a1a1a;display:block;margin-bottom:10px}
#audPt1 .ad-region-bars{height:100px;gap:18px}
#audPt1 .ad-region-bar .bar{width:38px}
#audPt1 .ad-region-bar .pct{display:block;margin-bottom:2px;font-size:14px;color:#E26B0F}
#audPt1 .ad-region-bar .name{display:block;font-size:11px}
#audPt1 .ad-hlbox .big{color:#E26B0F}
#audPt1 .ad-region-center span{color:#E26B0F}
#audPt1 .ad-region-bar .bar{background:linear-gradient(to top,#E26B0F,#EA553D)}
.ad-bars{background:transparent;border-radius:16px;padding:22px 26px;border:1px solid rgba(0,0,0,.08)}
.ad-job-row{display:flex;align-items:center;justify-content:space-around;gap:14px;padding:28px 10px}
.ad-job-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.ad-job-item .pct{font-size:26px;font-weight:700;font-family:var(--fn)}
.ad-job-item .name{font-size:12px;color:#555;white-space:nowrap}
#audPt2.ad-card{background:transparent;border:1px solid rgba(0,0,0,.06);box-shadow:none}
#audPt2 .ad-bars{background:transparent;border:none;box-shadow:none;padding:22px 10px}
#audPt2 .ad-job-item:nth-child(1) .pct{color:#E26B0F}
#audPt2 .ad-job-item:nth-child(2) .pct{color:#F5A200}
#audPt2 .ad-job-item:nth-child(3) .pct{color:#EA553D}
#audPt2 .ad-job-item:nth-child(4) .pct{color:#FBC02D}
#audPt2 .ad-industry-title{display:block;text-align:center;margin:24px 0 12px;font-size:16px;font-family:var(--fn);color:#1a1a1a}
#audPt2 .ad-pie-wrap{margin-top:0}
#audPt2 .ad-pie{background:conic-gradient(
  #E26B0F 0% 17.5%, #F5A200 17.5% 32.6%, #EA553D 32.6% 46.1%,
  #FBC02D 46.1% 59.6%, #F4A261 59.6% 72.1%,
  #E26B0F 72.1% 85.1%, #F5A200 85.1% 89.2%,
  #EA553D 89.2% 95.7%, #FBC02D 95.7% 100%
)}
#audPt3.ad-card{background:transparent;border:1px solid rgba(0,0,0,.06);box-shadow:none}
#audPt3 .ad-demand div:nth-child(1) b{color:#E26B0F}
#audPt3 .ad-demand div:nth-child(2) b{color:#F5A200}
#audPt3 .ad-demand div:nth-child(3) b{color:#FBC02D}
.ad-pie-wrap{display:flex;align-items:center;gap:22px;margin-top:8px}
.ad-pie{width:180px;height:180px;border-radius:50%;position:relative;flex-shrink:0;background:conic-gradient(
  #2EA7FF 0% 17.5%, #2EA7FF 17.5% 32.6%, #2EA7FF 32.6% 46.1%,
  #9EC8E8 46.1% 59.6%, #C2CEDE 59.6% 72.1%,
  #2EA7FF 72.1% 85.1%, #6FB3E6 85.1% 89.2%,
  #C2CEDE 89.2% 95.7%, #D9D9D9 95.7% 100%
)}
.ad-pie::after{content:"";position:absolute;inset:52px;border-radius:50%;background:#fff}
.ad-pie-label{position:absolute;font-size:11px;color:#555;font-weight:500;transform:translate(-50%,-50%)}
.ad-pie-list{flex:1;font-size:13px;line-height:2;color:#555}
.ad-pie-list b{color:#1a1a1a;font-weight:700}
.ad-demand{font-size:14px;color:#555;line-height:2.2}
.ad-demand b{color:#1a1a1a;font-size:16px;font-weight:700}
@media(max-width:980px){
  .ad-grid2{grid-template-columns:1fr}
  .ad-pie-wrap{flex-direction:column;align-items:flex-start}
  .ad-pie{margin:0 auto}
  .ad-pie-list{width:100%;margin-top:12px}
}
@media(max-width:560px){
  .ad-section{padding:50px 0 60px}
  .ad-card{padding:18px}
  .ad-stat-grid{grid-template-columns:1fr 1fr;gap:10px}
  .ad-stat-num{font-size:22px}
  .ad-job-row{gap:8px;padding:22px 6px}
  .ad-job-item .pct{font-size:20px}
  .ad-job-item .name{font-size:10.5px}
}
/* ===== Secondary button (white bg + orange border, aligned with Chinese version) ===== */
.btn-sec{background:#FFFFFF;color:var(--dmp-orange);border:1.5px solid var(--dmp-orange);box-shadow:none}
.btn-sec:hover{color:var(--wod-orange-red);border-color:var(--wod-orange-red);background:rgba(226,107,15,.06);box-shadow:0 12px 30px -12px rgba(234,85,61,.3);transform:translateY(-2px)}

/* skip-link a11y */
.skip-link{position:absolute;left:-9999px;top:0;z-index:9999;padding:10px 18px;background:#09112C;color:#fff;border-radius:0 0 8px 0;font-size:14px;text-decoration:none}
.skip-link:focus{left:0}

/* share buttons */
.share-sw{display:flex;gap:6px;align-items:center;margin-right:4px}
.share-sw button{width:26px;height:26px;border-radius:7px;border:1px solid rgba(var(--tint),.14);background:rgba(var(--tint),.06);color:var(--txt);font-size:12px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;line-height:1}
.share-sw button:hover{border-color:var(--red);color:var(--red)}
