/* 财富透镜「同一万个点」共享样式 · 由 lens.js 驱动 */
:root{
  --bg:#0a0a0b;--bg2:#131316;--ink:#ece7dc;--mute:#8b867c;--line:#26262b;
  --g0:#6f8fb3;--g1:#3fb59a;--g2:#e0607e;--g3:#f0b429;--neg:#ff5a5a;
  --disp:"Fraunces","Noto Serif SC",Georgia,serif;
  --cn:"Noto Serif SC","Songti SC","STSong",serif;
  --mono:"IBM Plex Mono","SFMono-Regular",Menlo,monospace;
  --body:"Noto Sans SC","PingFang SC","Hiragino Sans GB",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-weight:300;line-height:1.75;-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(ellipse 60% 40% at 18% 0%,#191a20 0%,transparent 70%),radial-gradient(ellipse 50% 50% at 100% 100%,#141317 0%,transparent 70%)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.35;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:96px 96px}
a{color:inherit}
.top{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:14px 28px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--mute);text-transform:uppercase;pointer-events:none;mix-blend-mode:screen}
.top b{color:var(--ink);font-weight:600}
.top a{pointer-events:auto;text-decoration:none;border-bottom:1px solid var(--line);margin-left:16px}
.wrap{position:relative;z-index:1;display:grid;grid-template-columns:58fr 42fr;min-height:100vh}
.stage{position:sticky;top:0;height:100vh;overflow:hidden}
.stage canvas{display:block;width:100%;height:100%}
.ui{position:absolute;left:0;right:0;bottom:0;padding:0 28px 22px;display:none;gap:8px;align-items:center;font-family:var(--mono);font-size:12px;color:var(--mute);pointer-events:none}
.ui>*{pointer-events:auto}
.stage[data-scene="ladder"] .ui.ladder,.stage[data-scene="time"] .ui.time,.stage[data-scene="money"] .ui.money,.stage[data-scene="people"] .ui.money{display:flex}
.btn{background:transparent;border:1px solid #33333a;color:var(--mute);padding:6px 12px;border-radius:999px;font:inherit;cursor:pointer;letter-spacing:.06em;transition:.2s}
.btn:hover{color:var(--ink);border-color:#55555e}
.btn.on{color:#0a0a0b;background:var(--ink);border-color:var(--ink)}
select.btn{appearance:none;-webkit-appearance:none;padding-right:28px;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238b867c'/%3E%3C/svg%3E") no-repeat right 12px center;max-width:min(60vw,340px)}
select.btn option{background:#141416;color:var(--ink)}
.steps{padding:0 clamp(24px,5vw,72px) 30vh}
.step{min-height:92vh;display:flex;align-items:center;opacity:.28;transition:opacity .5s}
.step.active{opacity:1}
.step>div{max-width:520px}
.k{font-family:var(--disp);font-style:italic;font-weight:300;font-size:15px;letter-spacing:.02em;color:var(--mute);margin-bottom:14px}
.k i{font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:.2em;margin-right:10px;color:#5b574f}
h1{font-family:var(--cn);font-weight:700;font-size:clamp(40px,4.6vw,66px);line-height:1.08;letter-spacing:-.01em;margin-bottom:22px}
h1 em{font-family:var(--disp);font-style:italic;font-weight:300;display:block;font-size:.5em;color:var(--mute);letter-spacing:0;margin-top:10px}
h2{font-family:var(--cn);font-weight:700;font-size:clamp(28px,2.6vw,38px);line-height:1.2;margin-bottom:18px}
h2 em{font-family:var(--disp);font-style:italic;font-weight:300;color:var(--g3)}
p{font-size:16px;margin-bottom:14px;color:#d6d1c6}
p b{font-weight:400;color:var(--ink)}
.num{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px 20px;margin:22px 0 10px;padding-top:16px;border-top:1px solid var(--line)}
.num div{font-family:var(--mono);font-size:11px;color:var(--mute);letter-spacing:.06em;line-height:1.5}
.num strong{display:block;font-family:var(--disp);font-weight:700;font-size:30px;line-height:1.1;letter-spacing:-.01em;color:var(--ink);margin-bottom:4px}
.num strong.g0{color:var(--g0)}.num strong.g1{color:var(--g1)}.num strong.g2{color:var(--g2)}.num strong.g3{color:var(--g3)}.num strong.neg{color:var(--neg)}
.src{font-family:var(--mono);font-size:11px;color:#5b574f;line-height:1.7;margin-top:14px}
.foot{position:relative;z-index:1;padding:40px clamp(24px,5vw,72px) 60px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;color:var(--mute);line-height:1.9;max-width:980px}
.foot h3{font-family:var(--cn);font-weight:300;font-size:18px;color:var(--ink);margin-bottom:10px}
@media (max-width:860px){
  .wrap{display:block}
  .stage{height:62vh;z-index:2;background:var(--bg);border-bottom:1px solid var(--line)}
  .ui{padding:0 14px 10px;font-size:11px;flex-wrap:wrap}
  .steps{padding:0 20px 20vh}
  .step{min-height:70vh;align-items:flex-start;padding-top:24px}
  h1{font-size:34px}h2{font-size:24px}p{font-size:15px}
  .num strong{font-size:24px}
  .top{padding:10px 14px;font-size:10px}
  .top a{margin-left:10px}
}
