:root{--bg:#020712;--blue:#70b3ff;--ice:#c5f9ff;--green:#e9f9b2;--red:#ff776d;--white:#f4f7ff;--muted:#8290a8;--ease:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;overflow-x:hidden}.grain{position:fixed;inset:0;pointer-events:none;z-index:99;opacity:.055;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 baseFrequency='.72' numOctaves='4' stitchTiles='stitchTiles'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");mix-blend-mode:screen}.cursor-aura{position:fixed;width:34vw;height:34vw;left:var(--mx,50%);top:var(--my,50%);translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,rgba(65,133,255,.12),transparent 67%);pointer-events:none;z-index:1;transition:background .6s;filter:blur(10px)}
.topbar{position:fixed;z-index:30;top:0;left:0;right:0;height:74px;padding:0 clamp(20px,3.3vw,64px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(255,255,255,.13);background:linear-gradient(180deg,rgba(2,7,18,.78),rgba(2,7,18,0));backdrop-filter:blur(12px)}.brand{color:inherit;text-decoration:none;font-weight:900;letter-spacing:-.07em;font-size:20px}.project-label{text-align:center;display:flex;gap:12px;align-items:center;font:10px/1 ui-monospace,monospace;letter-spacing:.13em;color:var(--muted)}.project-label b{font:700 12px/1 Arial,sans-serif;color:var(--white);letter-spacing:.02em}.menu-toggle{justify-self:end;background:none;color:inherit;border:0;font:12px/1 ui-monospace,monospace;letter-spacing:.1em;cursor:pointer;padding:18px 0}.menu-toggle i{display:inline-block;width:24px;height:1px;margin-left:10px;background:currentColor;vertical-align:middle;position:relative}.menu-toggle i:after{content:"";position:absolute;width:14px;height:1px;right:0;top:6px;background:currentColor}
.experience{position:relative;padding:118px clamp(18px,5vw,80px) 120px}.stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(38px,7vw,110px)}.scene{position:relative;width:min(100%,1440px);aspect-ratio:16/9;opacity:.42;transform:translateY(42px) scale(.965);transition:opacity .8s var(--ease),transform .9s var(--ease),filter .8s;filter:saturate(.7) brightness(.62);scroll-margin-top:100px}.scene.is-active{opacity:1;transform:none;filter:none}.scene img{width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none}.scene:before{content:attr(data-label);position:absolute;z-index:2;left:16px;top:16px;padding:8px 10px;background:rgba(2,7,18,.68);backdrop-filter:blur(8px);font:9px/1 ui-monospace,monospace;letter-spacing:.08em}.scene:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 40px 100px rgba(0,0,0,.45);pointer-events:none}.edge,.focus-toggle{display:none}
.hud{position:fixed;z-index:20;left:0;right:0;bottom:0;height:64px;padding:0 clamp(20px,3.3vw,64px);display:grid;grid-template-columns:90px 1fr 180px;gap:22px;align-items:center;background:linear-gradient(0deg,rgba(2,7,18,.94),rgba(2,7,18,.2));font:10px/1 ui-monospace,monospace}.counter b{font:500 21px/1 Arial,sans-serif}.counter span{color:var(--muted);margin-left:5px}.timeline{display:flex;align-items:center;height:32px;gap:5px}.tick{height:2px;flex:1;border:0;padding:0;background:rgba(255,255,255,.2);cursor:pointer;transition:height .2s,background .3s}.tick:hover{height:8px}.tick.is-active{height:4px;background:var(--accent,var(--blue))}.chapter-now{text-align:right;color:var(--muted);letter-spacing:.13em}.chapter-now i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent,var(--blue));margin-right:9px;box-shadow:0 0 14px var(--accent,var(--blue))}
.chapter-menu{position:fixed;z-index:50;right:0;top:0;width:min(520px,100%);height:100svh;background:rgba(5,8,12,.96);backdrop-filter:blur(20px);border-left:1px solid rgba(255,255,255,.18);padding:24px clamp(24px,4vw,52px);transform:translateX(102%);transition:transform .65s var(--ease);display:flex;flex-direction:column}.chapter-menu.is-open{transform:none}.menu-head{height:70px;display:flex;align-items:flex-start;justify-content:space-between;color:#8b939e;font:10px/1 ui-monospace,monospace;letter-spacing:.13em}.menu-close{font:300 30px/1 Arial;background:0;border:0;color:#fff;cursor:pointer}.chapter-menu>button:not(.menu-close){position:relative;display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto;text-align:left;color:#fff;background:none;border:0;border-top:1px solid rgba(255,255,255,.14);padding:22px 0;cursor:pointer;transition:padding .25s,color .25s}.chapter-menu>button:not(.menu-close):hover{padding-left:12px;color:var(--blue)}.chapter-menu>button.green:hover{color:var(--green)}.chapter-menu>button.red:hover{color:var(--red)}.chapter-menu em{grid-row:1/3;font:11px/1 ui-monospace,monospace;color:#6d7683;font-style:normal;padding-top:6px}.chapter-menu span{font-size:clamp(26px,4vw,44px);letter-spacing:-.05em}.chapter-menu small{font:9px/1.3 ui-monospace,monospace;letter-spacing:.13em;color:#6d7683;margin-top:7px}.menu-foot{margin-top:auto;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);color:#6d7683;font:9px/1 ui-monospace,monospace;letter-spacing:.12em}
.intro-gate{position:fixed;z-index:100;inset:0;background:#030711;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto;padding:clamp(25px,5vw,80px);transition:opacity .8s var(--ease),visibility .8s}.intro-gate.is-gone{opacity:0;visibility:hidden}.gate-mark{font:10px/1 ui-monospace,monospace;letter-spacing:.15em;color:#667183}.gate-copy{align-self:center}.gate-copy small{font:10px/1 ui-monospace,monospace;letter-spacing:.2em;color:var(--blue)}.gate-copy h1{font-size:clamp(56px,10vw,170px);line-height:.76;letter-spacing:-.1em;margin:28px 0;color:var(--blue);font-weight:600}.gate-copy p{font-size:clamp(18px,2vw,30px);color:#9ab1d0}.intro-gate button{grid-column:2;justify-self:end;color:#fff;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.4);font:12px/1 ui-monospace,monospace;padding:16px 0;letter-spacing:.15em;cursor:pointer}.intro-gate button span{font-size:24px;margin-left:40px}
.access-gate{position:fixed;z-index:120;inset:0;background:#030711;color:#f4f7ff;padding:clamp(25px,5vw,80px);display:grid;grid-template-rows:auto 1fr auto;transition:opacity .7s var(--ease),visibility .7s}.access-gate.is-unlocked{opacity:0;visibility:hidden;pointer-events:none}.access-mark,.access-foot{font:10px/1 ui-monospace,monospace;letter-spacing:.16em;color:#667183}.access-form{width:min(560px,100%);align-self:center;justify-self:center}.access-form small{font:10px/1 ui-monospace,monospace;letter-spacing:.2em;color:var(--blue)}.access-form h1{margin:25px 0 55px;font-size:clamp(42px,6vw,84px);line-height:.95;letter-spacing:-.07em;font-weight:500}.access-form label{display:block;margin-bottom:12px;font:9px/1 ui-monospace,monospace;letter-spacing:.16em;color:#667183}.access-field{display:grid;grid-template-columns:1fr 54px;border-bottom:1px solid rgba(255,255,255,.35)}.access-field input{min-width:0;border:0;outline:0;background:none;color:#fff;font:300 34px/1.4 ui-monospace,monospace;letter-spacing:.35em;padding:7px 0}.access-field button{border:0;background:none;color:#fff;font-size:26px;cursor:pointer}.access-form p{height:18px;margin:13px 0 0;color:#69768a;font:9px/1.4 ui-monospace,monospace;letter-spacing:.1em}.access-form.is-error{animation:access-shake .35s}.access-form.is-error p{color:var(--red)}@keyframes access-shake{25%{transform:translateX(-7px)}50%{transform:translateX(6px)}75%{transform:translateX(-3px)}}
body[data-theme="green"]{--accent:var(--green)}body[data-theme="red"]{--accent:var(--red)}body[data-theme="blue"]{--accent:var(--blue)}body[data-theme="green"] .cursor-aura{background:radial-gradient(circle,rgba(187,226,118,.1),transparent 67%)}body[data-theme="red"] .cursor-aura{background:radial-gradient(circle,rgba(205,42,35,.15),transparent 67%)}
@media(max-width:760px){.topbar{height:62px;grid-template-columns:1fr 1fr}.project-label{display:none}.experience{padding:88px 14px 92px}.stage{gap:24px}.scene{width:100%;opacity:1!important;transform:none!important;filter:none!important;transition:none}.scene:before{left:10px;top:10px;padding:6px 8px}.hud{height:52px;grid-template-columns:72px 1fr}.chapter-now{display:none}.intro-gate{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.gate-copy{grid-column:1}.gate-copy h1{font-size:20vw}.intro-gate button{grid-column:1}.chapter-menu{width:100%}.cursor-aura{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}