:root{font-family:Microsoft YaHei,PingFang SC,Noto Sans CJK SC,system-ui,sans-serif;color:#f1f5f4;background:#05080d;font-synthesis:none;text-rendering:optimizeLegibility;--void: #05080d;--deep: #08131d;--cyan: #59e1e6;--cyan-soft: #9af7f2;--gold: #d6b675;--text: #f1f5f4;--muted: #8a9ba6}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{min-width:320px}button{font:inherit}button:focus-visible{outline:2px solid var(--cyan-soft);outline-offset:5px}#app{position:relative;isolation:isolate;background:radial-gradient(circle at 70% 45%,rgba(45,40,110,.18),transparent 40%),linear-gradient(135deg,#02040a,#050817 62%,#02040a)}#scene{position:absolute;inset:0;width:100%;height:100%;z-index:1;cursor:crosshair;touch-action:manipulation}.ambient,.grid-overlay,.vignette{position:absolute;inset:0;pointer-events:none}.ambient{z-index:2;background:radial-gradient(ellipse at 72% 48%,rgba(78,82,220,.09),transparent 34%),radial-gradient(ellipse at 76% 58%,rgba(155,77,202,.045),transparent 38%)}.grid-overlay{z-index:2;opacity:.05;background-image:linear-gradient(rgba(134,199,207,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(134,199,207,.045) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.45),transparent 72%)}.vignette{z-index:3;box-shadow:inset 0 0 180px 30px #0000009e;background:linear-gradient(90deg,rgba(5,8,13,.35),transparent 48%,rgba(5,8,13,.08))}.topbar{position:absolute;z-index:10;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:clamp(24px,4vw,52px) clamp(24px,5.5vw,88px)}.brand{display:flex;align-items:center;gap:12px;color:#f1f5f4cc;font-size:13px;letter-spacing:.18em}.brand-mark{width:30px;height:30px;color:var(--cyan);filter:drop-shadow(0 0 8px rgba(89,225,230,.22))}.skip-button,.text-button{appearance:none;border:0;color:#f1f5f4a3;background:transparent;cursor:pointer;transition:color .18s ease,border-color .18s ease,background .18s ease}.skip-button{padding:9px 0 9px 18px;border-left:1px solid rgba(154,247,242,.24);font-size:12px;letter-spacing:.12em}.skip-button:hover,.text-button:hover{color:var(--cyan-soft)}.intro{position:absolute;z-index:8;left:clamp(28px,9vw,150px);top:50%;width:min(48vw,690px);transform:translateY(-45%);pointer-events:none}.status-line{display:flex;align-items:center;gap:10px;min-height:22px;margin-bottom:26px;color:var(--cyan-soft);font-size:12px;letter-spacing:.18em;opacity:0;animation:status-in .8s .2s ease forwards;transition:opacity .5s ease,transform .5s ease}.status-dot,.render-indicator{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan);animation:breathe 1.8s ease-in-out infinite}.title{margin:0;font-size:clamp(54px,7.2vw,124px);font-weight:300;line-height:1.08;letter-spacing:.08em}.title span{display:block;width:max-content;max-width:100%;opacity:0;transform:translateY(45px);filter:blur(12px);transition:opacity 1.1s ease,transform 1.1s cubic-bezier(.2,.75,.2,1),filter 1.1s ease}.title span:first-child{color:var(--text);text-shadow:0 0 44px rgba(154,247,242,.08)}.title span:last-child{margin-top:.08em;color:transparent;-webkit-text-stroke:1px rgba(154,247,242,.68);text-shadow:0 0 28px rgba(89,225,230,.1);transition-delay:.14s}.subtitle{margin:32px 0 0;color:#f1f5f49e;font-size:clamp(14px,1.15vw,19px);font-weight:300;letter-spacing:.32em;opacity:0;transform:translateY(16px);transition:opacity .9s .28s ease,transform .9s .28s ease}.enter-row{display:flex;align-items:center;gap:26px;margin-top:42px;opacity:0;transform:translateY(18px);transition:opacity .8s .48s ease,transform .8s .48s ease}.enter-button{position:relative;appearance:none;min-width:156px;padding:15px 28px;border:1px solid var(--gold);border-radius:2px;color:#101215;background:var(--gold);font-size:14px;font-weight:600;letter-spacing:.2em;cursor:pointer;pointer-events:auto;overflow:hidden;transition:color .22s ease,background .22s ease,box-shadow .22s ease,transform .22s ease}.enter-button:hover{color:var(--gold);background:#d6b6750f;box-shadow:0 0 32px #d6b67521;transform:translateY(-2px)}.enter-button:active{transform:translateY(0)}.interaction-hint{color:#8a9ba69e;font-size:11px;letter-spacing:.08em}.sequence{position:absolute;z-index:8;left:clamp(28px,5.5vw,88px);bottom:clamp(28px,5vw,62px);display:flex;align-items:center;gap:0;color:#8a9ba66b}.sequence-item{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px;width:clamp(108px,10vw,164px);padding-bottom:14px;font-size:11px;letter-spacing:.12em;transition:color .4s ease}.sequence-index{font-family:DIN Alternate,Arial Narrow,sans-serif;font-size:10px;letter-spacing:0;opacity:.6}.sequence-item i{position:absolute;left:0;right:0;bottom:0;height:1px;overflow:hidden;background:#8a9ba624}.sequence-item i:after{content:"";display:block;width:100%;height:100%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);transform:translate(-102%);transition:transform .8s ease}.sequence-item.is-active{color:#9af7f2d6}.sequence-item.is-active i:after,.sequence-item.is-complete i:after{transform:translate(0)}.sequence-item.is-complete{color:#8a9ba69e}.render-note{position:absolute;z-index:8;right:clamp(28px,5.5vw,88px);bottom:clamp(28px,5vw,62px);display:flex;align-items:center;gap:9px;color:#8a9ba67a;font-size:10px;letter-spacing:.14em}.render-indicator{width:4px;height:4px}.is-final .title span,.is-final .subtitle,.is-final .enter-row{opacity:1;transform:translateY(0);filter:blur(0)}.is-final .status-line{opacity:0;transform:translateY(-8px)}.is-final .skip-button{opacity:0;pointer-events:none}.demo-panel{position:absolute;z-index:20;inset:0;display:grid;place-items:center;padding:28px;visibility:hidden;opacity:0;background:#05080dc2;backdrop-filter:blur(18px);transition:opacity .5s ease,visibility .5s}.demo-panel-inner{width:min(580px,100%);padding:clamp(32px,5vw,64px);border-left:1px solid var(--cyan);background:#08131dd1;transform:translateY(20px);transition:transform .5s ease}.demo-kicker{color:var(--cyan);font-family:DIN Alternate,Arial Narrow,sans-serif;font-size:12px;letter-spacing:.12em}.demo-panel h2{margin:24px 0 18px;font-size:clamp(30px,4vw,48px);font-weight:300;letter-spacing:.08em}.demo-panel p{margin:0 0 34px;color:var(--muted);font-size:14px;line-height:1.9}.text-button{padding:0 0 7px;border-bottom:1px solid rgba(154,247,242,.35);font-size:13px;letter-spacing:.14em}.show-demo .demo-panel{visibility:visible;opacity:1}.show-demo .demo-panel-inner{transform:translateY(0)}.transition-wash{position:absolute;z-index:30;inset:0;pointer-events:none;background:var(--cyan-soft);opacity:0}.is-leaving .transition-wash{animation:wash .65s ease-in-out forwards}.data-keywords{position:absolute;z-index:6;inset:0;pointer-events:none;opacity:1;transition:opacity .5s ease}.data-keyword{--keyword-delay: calc(var(--order) * .36s);position:absolute;display:flex;align-items:center;gap:10px;padding:7px 11px;border-left:1px solid rgba(89,225,230,.42);color:#c4eff0d1;background:linear-gradient(90deg,#081922b3,#08192200);font-size:12px;font-weight:300;letter-spacing:.16em;white-space:nowrap;opacity:0;transform:translateY(8px);filter:blur(4px);transition:opacity .65s var(--keyword-delay) ease,transform .65s var(--keyword-delay) ease,filter .65s var(--keyword-delay) ease}.data-keyword i{position:relative;display:block;width:5px;height:5px;border:1px solid var(--cyan);border-radius:50%;box-shadow:0 0 10px #59e1e68c}.data-keyword i:after{content:"";position:absolute;top:1px;left:8px;width:24px;height:1px;background:linear-gradient(90deg,rgba(89,225,230,.42),transparent);transform:translate(-100%)}.keyword-1{left:57%;top:23%}.keyword-2{left:78%;top:31%}.keyword-3{left:52%;top:62%}.keyword-4{left:74%;top:72%}.keyword-5{left:84%;top:53%}.stage-1 .data-keyword,.stage-2 .data-keyword{opacity:1;transform:translateY(0);filter:blur(0)}.stage-2 .keyword-1,.stage-2 .keyword-3{color:#d6b675c7;border-left-color:#d6b6756b}.is-final .data-keywords,.stage-3 .data-keywords{opacity:0}.fallback-core{position:absolute;z-index:4;top:47%;right:17%;display:none;width:min(30vw,390px);aspect-ratio:1;transform:translate(50%,-50%)}.fallback-core i,.fallback-core b{position:absolute;inset:0;border:1px solid rgba(89,225,230,.24);border-radius:50%;box-shadow:0 0 50px #59e1e60d}.fallback-core i:nth-child(2){inset:13%;border-color:#d6b6754d;transform:rotateX(64deg)}.fallback-core i:nth-child(3){inset:25%;transform:rotateY(64deg)}.fallback-core b{inset:40%;border:0;background:var(--cyan-soft);box-shadow:0 0 65px 22px #59e1e647}.no-webgl #scene,.reduce-motion #scene{opacity:0}.no-webgl .fallback-core,.reduce-motion .fallback-core{display:block}@keyframes status-in{to{opacity:1}}@keyframes breathe{0%,to{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}@keyframes wash{0%{opacity:0}45%{opacity:.7}to{opacity:0}}@media(max-width:760px){.topbar{padding:24px}.brand{font-size:11px}.intro{inset:auto 28px 25%;width:auto;transform:none}.title{font-size:clamp(48px,15vw,76px)}.subtitle{margin-top:22px;letter-spacing:.18em}.enter-row{align-items:flex-start;flex-direction:column;gap:16px;margin-top:28px}.interaction-hint{display:none}.sequence{left:28px;right:28px;bottom:34px}.sequence-item{width:33.333%;font-size:10px}.render-note{display:none}.data-keyword{gap:7px;padding:5px 7px;font-size:10px;letter-spacing:.08em}.keyword-1{left:12%;top:14%}.keyword-2{left:66%;top:19%}.keyword-3{left:8%;top:34%}.keyword-4{left:61%;top:39%}.keyword-5{left:69%;top:50%}.fallback-core{top:28%;right:50%;width:56vw}.vignette{background:linear-gradient(0deg,rgba(5,8,13,.5),transparent 60%)}}@media(max-height:650px)and (min-width:761px){.intro{transform:translateY(-40%)}.title{font-size:clamp(48px,6.6vw,86px)}.subtitle{margin-top:20px}.enter-row{margin-top:26px}.status-line{margin-bottom:18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
