:root{--void: #06070a;--void-2: #0a0c10;--bone: #ece6d9;--bone-2: rgba(236, 230, 217, .66);--bone-3: rgba(236, 230, 217, .38);--bone-4: rgba(236, 230, 217, .16);--bone-5: rgba(236, 230, 217, .08);--bronze: #c8a678;--bronze-dim: rgba(200, 166, 120, .55);--steel: #9fb6c4;--serif: "Cormorant Garamond", "Times New Roman", "Songti SC", serif;--sans: "Inter", -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;--cjk: "Noto Serif SC", "Songti SC", "SimSun", serif;--ease: cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#06070a;color:var(--bone);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#app{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;background:radial-gradient(120% 90% at 50% 42%,#141821,#0a0c11 45%,#05060a)}#scene{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;outline:none;cursor:grab}#scene:active{cursor:grabbing}.vignette{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2;background:radial-gradient(86% 74% at 50% 46%,#0000 48%,#00000042 80%,#0000009e),linear-gradient(to bottom,#0000006b,#0000 20%,#0000 70%,#0009)}.grain{position:absolute;top:-50%;right:-50%;bottom:-50%;left:-50%;pointer-events:none;z-index:3;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");animation:grainShift .9s steps(3) infinite}@keyframes grainShift{0%{transform:translate(0)}33%{transform:translate(-3%,2%)}66%{transform:translate(2%,-2%)}to{transform:translate(0)}}.intro-kicker,.detail-kicker,.legend-title{font-size:9px;letter-spacing:.38em;text-transform:uppercase;color:var(--bronze);font-weight:500}.intro{position:absolute;top:0;right:0;bottom:0;left:0;z-index:40;display:grid;place-items:center;background:radial-gradient(70% 60% at 50% 44%,#12161ee6,#06070af7 62%,#050609);transition:opacity 1.4s var(--ease),visibility 1.4s}.intro.hidden{opacity:0;visibility:hidden;pointer-events:none}.intro-inner{text-align:center;padding:0 24px;max-width:760px;animation:introIn 1.8s var(--ease) both}@keyframes introIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}.intro-kicker{margin-bottom:34px;opacity:.85}.intro-title{font-family:var(--serif);font-weight:300;font-size:clamp(56px,11vw,132px);line-height:.9;letter-spacing:.16em;margin:0 0 18px .16em;color:#f3eee2;text-shadow:0 0 70px rgba(200,166,120,.18)}.intro-sub{font-size:11px;letter-spacing:.62em;text-transform:uppercase;color:var(--bone-2);margin-bottom:22px}.intro-cn{font-family:var(--cjk);font-weight:300;font-size:15px;letter-spacing:.34em;color:var(--bronze);margin-bottom:42px}.intro-desc{font-size:13px;line-height:2.1;letter-spacing:.08em;color:var(--bone-3);margin:0 0 46px;font-weight:300}.enter-btn{position:relative;display:inline-flex;align-items:center;gap:18px;padding:16px 38px;background:transparent;border:1px solid rgba(236,230,217,.35);color:var(--bone);font-family:var(--sans);font-size:12px;letter-spacing:.22em;cursor:pointer;overflow:hidden;transition:border-color .6s var(--ease),letter-spacing .6s var(--ease)}.enter-btn span{position:relative;z-index:1}.enter-en{font-size:9px;letter-spacing:.3em;color:var(--bronze)}.enter-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#ece6d917;transform:translateY(101%);transition:transform .7s var(--ease)}.enter-btn:hover{border-color:#ece6d9cc}.enter-btn:hover:before{transform:translateY(0)}.intro-foot{margin-top:76px;font-size:9px;letter-spacing:.26em;color:#ece6d947;text-transform:uppercase;display:flex;justify-content:center;gap:14px}.intro-foot .dot{opacity:.5}.topbar{position:absolute;top:0;left:0;right:0;z-index:20;padding:30px 40px 0;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none;opacity:0;transition:opacity 1.2s var(--ease) .6s}.ready .topbar{opacity:1}.brand-mark{font-family:var(--serif);font-size:19px;letter-spacing:.34em;color:var(--bone);font-weight:400}.brand-sub{margin-top:5px;font-size:8px;letter-spacing:.44em;color:var(--bone-3);text-transform:uppercase}.topbar-right{display:flex;gap:10px;align-items:center;pointer-events:auto}.mode-btn{display:inline-flex;align-items:center;gap:9px;padding:8px 14px;background:#0a0c1059;border:1px solid var(--bone-4);color:var(--bone-3);font-family:var(--sans);font-size:9px;letter-spacing:.2em;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:color .4s,border-color .4s,background .4s}.mode-dot{width:4px;height:4px;border-radius:50%;background:var(--bone-4);transition:background .4s,box-shadow .4s}.mode-btn:hover{color:var(--bone);border-color:var(--bone-3)}.mode-btn.active{color:var(--bone);border-color:var(--bronze-dim);background:#c8a6781a}.mode-btn.active .mode-dot{background:var(--bronze);box-shadow:0 0 8px var(--bronze)}.icon-btn{width:32px;height:32px;display:grid;place-items:center;background:#0a0c1059;border:1px solid var(--bone-4);color:var(--bone-2);font-size:13px;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:color .4s,border-color .4s}.icon-btn:hover{color:var(--bone);border-color:var(--bone-3)}.icon-btn.small{width:26px;height:26px;font-size:14px}.readout{position:absolute;left:44px;top:122px;z-index:15;width:220px;opacity:0;transform:translateY(10px);transition:opacity 1.2s var(--ease) .9s,transform 1.2s var(--ease) .9s;pointer-events:none}.ready .readout{opacity:1;transform:none}.readout-year{font-family:var(--serif);font-size:76px;line-height:.86;font-weight:300;letter-spacing:.01em;color:#f5f0e4;font-variant-numeric:tabular-nums;text-shadow:0 4px 40px rgba(0,0,0,.8)}.readout-era{margin-top:14px;display:flex;flex-direction:column;gap:5px}.era-en{font-size:9px;letter-spacing:.34em;color:var(--bronze);text-transform:uppercase}.era-cn{font-family:var(--cjk);font-size:12px;letter-spacing:.24em;color:var(--bone-2);font-weight:300}.readout-rule{height:1px;width:100%;background:linear-gradient(to right,var(--bone-4),transparent);margin:20px 0 16px}.readout-stats{margin:0;display:flex;flex-direction:column;gap:9px}.readout-stats>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.readout-stats dt{font-size:9px;letter-spacing:.16em;color:#ece6d94d}.readout-stats dd{margin:0;font-size:10px;letter-spacing:.1em;color:var(--bone-2);font-variant-numeric:tabular-nums;text-align:right}.event-card{position:absolute;left:44px;bottom:186px;z-index:18;width:348px;padding:20px 22px 20px 20px;border-left:1px solid var(--bronze-dim);background:linear-gradient(100deg,#05070ae6,#05070a9e 62%,#05070a0f);-webkit-backdrop-filter:blur(9px) saturate(115%);backdrop-filter:blur(9px) saturate(115%);border-radius:0 3px 3px 0;opacity:0;transform:translateY(14px);transition:opacity .9s var(--ease),transform .9s var(--ease);pointer-events:none}.event-card.show{opacity:1;transform:none;pointer-events:auto}.event-year{font-family:var(--serif);font-size:12px;letter-spacing:.3em;color:var(--bronze);margin-bottom:9px}.event-title{font-family:var(--serif);font-weight:400;font-size:27px;line-height:1.12;margin:0 0 6px;color:#f3eee2;letter-spacing:.01em}.event-cn{font-family:var(--cjk);font-size:12px;letter-spacing:.18em;color:var(--bone-2);margin-bottom:14px;font-weight:300}.event-body{font-size:11.5px;line-height:1.95;color:#ece6d985;margin:0 0 14px;font-weight:300;letter-spacing:.03em}.event-focus{background:none;border:none;padding:0;color:var(--bone-3);font-family:var(--sans);font-size:9px;letter-spacing:.22em;cursor:pointer;transition:color .4s}.event-focus:hover{color:var(--bronze)}.detail{position:absolute;right:44px;top:50%;transform:translate(20px,-50%);z-index:22;width:322px;padding:26px 26px 24px;background:#090b0fb8;border:1px solid var(--bone-4);-webkit-backdrop-filter:blur(18px) saturate(120%);backdrop-filter:blur(18px) saturate(120%);opacity:0;visibility:hidden;transition:opacity .7s var(--ease),transform .7s var(--ease),visibility .7s;pointer-events:none}.detail.show{opacity:1;visibility:visible;transform:translateY(-50%);pointer-events:auto}.detail-close{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--bone-3);font-size:18px;line-height:1;cursor:pointer;transition:color .3s}.detail-close:hover{color:var(--bone)}.detail-kicker{margin-bottom:14px}.detail-title{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.15;margin:0 0 8px;color:#f3eee2}.detail-meta{font-size:9px;letter-spacing:.18em;color:var(--bronze);text-transform:uppercase;margin-bottom:18px;line-height:1.7}.detail-body{font-size:11.5px;line-height:2;color:#ece6d999;margin:0 0 16px;font-weight:300}.detail-foot{font-size:9px;letter-spacing:.14em;color:#ece6d94d;padding-top:12px;border-top:1px solid var(--bone-5);line-height:1.8}.timeline{position:absolute;left:40px;right:40px;bottom:26px;z-index:25;display:flex;align-items:center;gap:22px;padding:18px 22px 12px;background:linear-gradient(to bottom,#080a0e47,#080a0e8c);border-top:1px solid var(--bone-5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;transform:translateY(12px);transition:opacity 1.2s var(--ease) 1.1s,transform 1.2s var(--ease) 1.1s}.ready .timeline{opacity:1;transform:none}.tl-left,.tl-right{display:flex;align-items:center;gap:8px;flex:0 0 auto}.play-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--bone-4);background:transparent;color:var(--bone);display:grid;place-items:center;cursor:pointer;transition:border-color .4s,background .4s,color .4s}.play-btn:hover{border-color:var(--bronze);color:var(--bronze);background:#c8a67814}.play-btn.playing{border-color:var(--bronze);color:var(--bronze)}.play-btn svg{display:block}.tl-main{flex:1 1 auto;min-width:0}.tl-eras{position:relative;height:14px;margin-bottom:8px}.era-seg{position:absolute;top:0;height:14px;padding-left:6px;border-left:1px solid var(--bone-4);overflow:hidden;white-space:nowrap}.era-seg span{font-size:8px;letter-spacing:.2em;color:#ece6d952;text-transform:uppercase;transition:color .5s}.era-seg.current span{color:var(--bronze)}.rail{position:relative;height:30px;cursor:pointer;touch-action:none}.rail-line{position:absolute;left:0;right:0;top:11px;height:1px;background:var(--bone-5)}.rail-progress{position:absolute;left:0;top:11px;height:1px;width:0%;background:linear-gradient(to right,rgba(200,166,120,.15),var(--bronze));box-shadow:0 0 10px #c8a67880}.rail-ticks{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.tick{position:absolute;top:8px;width:1px;height:7px;background:#ece6d938}.tick.major{height:11px;top:6px;background:#ece6d966}.rail-events{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.ev-dot{position:absolute;top:9px;width:5px;height:5px;margin-left:-2.5px;background:#ece6d980;transform:rotate(45deg);transition:background .4s,box-shadow .4s;pointer-events:auto;cursor:pointer}.ev-dot:hover{background:var(--bone);box-shadow:0 0 8px #ece6d9cc}.ev-dot.near{background:var(--bronze);box-shadow:0 0 10px #c8a678e6}.handle{position:absolute;top:-6px;bottom:-2px;left:0;width:1px;pointer-events:none;will-change:left}.handle-line{position:absolute;top:2px;bottom:10px;left:0;width:1px;background:linear-gradient(to bottom,#ece6d9e6,#ece6d926)}.handle-knob{position:absolute;top:7px;left:-3.5px;width:8px;height:8px;background:#f3eee2;transform:rotate(45deg);box-shadow:0 0 14px #ece6d98c}.handle-year{position:absolute;bottom:-14px;left:0;transform:translate(-50%);font-family:var(--serif);font-size:12px;letter-spacing:.14em;color:var(--bone);background:#080a0ed9;padding:1px 6px;opacity:0;transition:opacity .3s}.rail:hover .handle-year,.rail.dragging .handle-year{opacity:1}.tl-scale{display:flex;justify-content:space-between;margin-top:10px;font-size:8px;letter-spacing:.18em;color:#ece6d940;font-variant-numeric:tabular-nums}.hud-hint{position:absolute;right:44px;bottom:132px;z-index:14;display:flex;gap:9px;font-size:8.5px;letter-spacing:.18em;color:#ece6d942;text-transform:uppercase;opacity:0;transition:opacity 1.2s var(--ease) 1.6s;pointer-events:none}.ready .hud-hint{opacity:1}.hud-hint .sep{opacity:.4}.scan-legend{position:absolute;right:44px;bottom:168px;z-index:19;width:190px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .6s var(--ease),transform .6s var(--ease),visibility .6s;pointer-events:none}.scan-legend.show{opacity:1;visibility:visible;transform:none}.legend-bar{height:3px;margin:9px 0 7px;background:linear-gradient(to right,#1f3a6b,#2c8a8a 32%,#d6a03c 62%,#e8622a 84%,#ffe9c9)}.legend-labels{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.12em;color:#ece6d959;font-variant-numeric:tabular-nums}.tooltip{position:absolute;z-index:30;pointer-events:none;padding:9px 12px;background:#080a0edb;border:1px solid var(--bone-4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;transform:translate(12px,12px);transition:opacity .2s;max-width:220px}.tooltip.show{opacity:1}.tooltip .tt-title{font-family:var(--serif);font-size:14px;color:#f3eee2;margin-bottom:3px;line-height:1.2}.tooltip .tt-meta{font-size:8.5px;letter-spacing:.16em;color:var(--bronze);text-transform:uppercase}.tooltip .tt-note{margin-top:6px;font-size:9px;line-height:1.6;color:#ece6d973;letter-spacing:.02em}.about{position:absolute;top:0;right:0;bottom:0;left:0;z-index:45;display:grid;place-items:center;background:#040508e0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;visibility:hidden;transition:opacity .7s var(--ease),visibility .7s}.about.show{opacity:1;visibility:visible}.about-inner{position:relative;width:min(760px,calc(100% - 64px));border:1px solid var(--bone-4);padding:52px 54px 40px;background:#090b0f99}.about-title{font-family:var(--cjk);font-weight:300;font-size:34px;line-height:1.5;letter-spacing:.1em;margin:22px 0 34px;color:#f3eee2}.about-cols{display:grid;grid-template-columns:1fr 1fr;gap:30px}.about-cols p:nth-child(3){grid-column:1 / -1;padding-top:14px;border-top:1px solid var(--bone-4);color:#c8a678a8}.about-cols p{font-size:11.5px;line-height:2.1;color:#ece6d98c;margin:0;font-weight:300}.about-cols strong{color:var(--bone-2);font-weight:400}.about-legend{margin-top:34px;padding-top:22px;border-top:1px solid var(--bone-5);display:flex;gap:28px;flex-wrap:wrap;font-size:9px;letter-spacing:.12em;color:#ece6d966}.about-legend>div{display:flex;align-items:center;gap:8px}.sw{width:10px;height:10px;display:inline-block}.sw-real{background:#cfc4ae}.sw-approx{background:#6d6a64}.sw-ghost{border:1px solid var(--steel);background:#9fb6c41f}.about-foot{margin-top:30px;font-size:8.5px;letter-spacing:.16em;color:#ece6d938;text-transform:uppercase}.loader{position:absolute;top:0;right:0;bottom:0;left:0;z-index:50;background:#05060a;display:grid;place-items:center;gap:20px;grid-auto-rows:min-content;align-content:center;transition:opacity 1s var(--ease),visibility 1s}.loader.hidden{opacity:0;visibility:hidden;pointer-events:none}.loader-line{width:180px;height:1px;background:#ece6d91f;overflow:hidden}.loader-line span{display:block;height:100%;width:40%;background:var(--bronze);animation:loadSweep 1.5s var(--ease) infinite}@keyframes loadSweep{0%{transform:translate(-100%)}to{transform:translate(350%)}}.loader-text{font-size:8.5px;letter-spacing:.4em;color:#ece6d959;text-transform:uppercase}@media (max-width: 1100px){.readout{top:108px;left:28px}.readout-year{font-size:58px}.event-card{left:28px;width:280px;bottom:172px}.timeline{left:20px;right:20px}.topbar{padding:24px 28px 0}.detail{right:28px;width:280px}.hud-hint{display:none}.scan-legend{right:28px;bottom:152px}}@media (max-width: 780px){.brand-sub,.event-card,.readout-stats{display:none}.readout{top:92px}.readout-year{font-size:44px}.mode-btn{padding:7px 10px;font-size:8px;letter-spacing:.12em}.detail{right:16px;left:16px;width:auto;top:auto;bottom:150px;transform:none}.detail.show{transform:none}.about-inner{padding:34px 26px}.about-cols{grid-template-columns:1fr;gap:16px}.about-title{font-size:24px}}