:root{--mx:0;--my:0;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth}body,html{background:#03050a}body{margin:0;color:#f5f8ff;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a,button{color:inherit;font:inherit}.scene{--accent:#8b5dff;--accent2:#00d9ff;--accent3:#ff4fbe;position:relative;min-height:400vh;background:#03050a;transition:--accent .95s,--accent2 .95s,--accent3 .95s}.scene-1{--accent:#00bfff;--accent2:#38ffc7;--accent3:#525cff}.scene-2{--accent:#ff3f9f;--accent2:#ffbd3f;--accent3:#9b4dff}.scene:before{z-index:0;background:radial-gradient(ellipse at 69% 44%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 32%),radial-gradient(ellipse at 78% 57%,color-mix(in srgb,var(--accent2) 9%,transparent),transparent 30%),radial-gradient(ellipse at 16% 95%,rgba(58,83,153,.18),transparent 38%),linear-gradient(135deg,#080b14 0,#03050a 60%,#010207 100%)}.scene:after,.scene:before{content:"";position:fixed;inset:0;pointer-events:none}.scene:after{z-index:24;opacity:.028;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}.star-field{inset:0;z-index:2;width:100%;height:100%}.star-field,.water-glow{position:fixed;pointer-events:none}.water-glow{z-index:1;left:50%;top:50%;width:74vw;height:74vw;transform:translate(-34%,-50%);border-radius:50%;opacity:.45;background:radial-gradient(circle,rgba(80,138,225,.045),transparent 64%);filter:blur(6px)}.nav{position:fixed;z-index:30;left:0;right:0;top:0;height:96px;padding:0 4.5vw;border-bottom:1px solid rgba(255,255,255,.075);background:rgba(4,6,11,.28);-webkit-backdrop-filter:blur(22px) saturate(140%);backdrop-filter:blur(22px) saturate(140%)}.mark,.nav{display:flex;align-items:center}.mark{gap:11px;width:33%;text-decoration:none;font-weight:630;letter-spacing:.01em;font-size:15px}.mark>i{position:relative;width:23px;height:23px;border-radius:50%;background:radial-gradient(circle at 68% 76%,var(--accent2),transparent 48%),linear-gradient(145deg,rgba(255,255,255,.62),var(--accent) 42%,var(--accent3));border:1px solid rgba(255,255,255,.55);box-shadow:inset 2px 2px 7px rgba(255,255,255,.55),inset -4px -5px 8px rgba(20,22,80,.28),0 0 20px color-mix(in srgb,var(--accent) 46%,transparent);overflow:hidden;transition:background .9s,box-shadow .9s;animation:markPulse 4.5s ease-in-out infinite}.mark>i b{position:absolute;width:64%;height:54%;top:-10%;left:-2%;border-radius:50%;background:white;filter:blur(3px);opacity:.75;transform:rotate(-24deg)}@keyframes markPulse{50%{transform:scale(1.1) rotate(8deg);box-shadow:inset 2px 2px 7px rgba(255,255,255,.55),inset -4px -5px 8px rgba(20,22,80,.28),0 0 27px color-mix(in srgb,var(--accent2) 58%,transparent)}}.nav nav{display:flex;gap:38px;justify-content:center;width:34%}.nav nav a{text-decoration:none;font-size:12px;color:#969cab;transition:.25s}.nav nav a:hover{color:white}.nav>button{margin-left:auto;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.045);padding:10px 14px;border-radius:99px;font-size:11px;cursor:pointer;-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);box-shadow:inset 0 1px rgba(255,255,255,.12)}.nav>button span{display:inline-grid;place-items:center;margin-left:12px;background:rgba(255,255,255,.92);color:#080a0e;width:22px;height:22px;border-radius:50%}.glass-stage{position:fixed;z-index:6;top:50%;left:68%;width:min(54vw,780px);aspect-ratio:1;transform:translate(calc(-50% + var(--mx)*8px),calc(-50% + var(--my)*7px));transition:transform .22s cubic-bezier(.2,.8,.2,1);display:grid;place-items:center;perspective:1000px}.orb-physics{--physics-x:0px;--physics-y:0px;--press:0;--impact:0;--speed:0;--physics-rotate:0deg;width:59%;height:59%;position:relative;z-index:3;touch-action:none;cursor:grab;outline:none;transform:translate3d(var(--physics-x),var(--physics-y),0) rotate(var(--physics-rotate)) scaleX(calc(1 + var(--impact)*.075 - var(--press)*.045)) scaleY(calc(1 - var(--impact)*.055 + var(--press)*.055));transform-origin:center;will-change:transform}.orb-physics:active{cursor:grabbing}.orb-physics:focus-visible{filter:drop-shadow(0 0 16px color-mix(in srgb,var(--accent2) 55%,transparent))}.orb-idle{width:100%;height:100%;animation:floatLoop 6.8s ease-in-out infinite}.liquid-shell{width:100%;height:100%;position:relative;overflow:hidden;isolation:isolate;border:1px solid rgba(242,250,255,.52);border-radius:50%;transform:rotate(var(--spin)) scaleX(calc(1 - var(--press)*.045 + var(--speed)*.025)) scaleY(calc(1 + var(--press)*.045 - var(--speed)*.018));background:linear-gradient(145deg,rgba(245,252,255,.075),rgba(188,220,255,.018) 38%,rgba(148,192,255,.035) 76%,rgba(255,255,255,.065));box-shadow:inset 10px 8px 22px rgba(255,255,255,.16),inset -19px -21px 34px rgba(8,28,68,.12),inset 0 -3px 16px color-mix(in srgb,var(--accent2) 18%,transparent),0 0 0 1px rgba(255,255,255,.055),0 34px 80px rgba(0,0,0,.48),0 8px 40px color-mix(in srgb,var(--accent) 18%,transparent);backdrop-filter:blur(9px) saturate(185%) contrast(1.16);-webkit-backdrop-filter:blur(9px) saturate(185%) contrast(1.16);animation:shapeFlow 7.4s ease-in-out infinite;transition:box-shadow .9s,background .9s;will-change:transform,border-radius}.liquid-shell:before{content:"";position:absolute;z-index:6;inset:-1px;border-radius:inherit;background:conic-gradient(from 204deg,transparent 0 17%,rgba(58,207,255,.32) 24%,rgba(255,255,255,.78) 30%,transparent 38% 70%,color-mix(in srgb,var(--accent3) 38%,transparent) 78%,rgba(255,255,255,.32) 87%,transparent 94%);-webkit-mask:radial-gradient(circle,transparent 68%,#000 78%,#000 100%);mask:radial-gradient(circle,transparent 68%,#000 78%,#000 100%);filter:blur(3px);opacity:.74;mix-blend-mode:screen}.liquid-shell:after{content:"";z-index:2;inset:4%;background:radial-gradient(circle at 64% 60%,transparent 45%,color-mix(in srgb,var(--accent2) 14%,transparent) 67%,transparent 75%);-webkit-backdrop-filter:blur(2px) saturate(165%);backdrop-filter:blur(2px) saturate(165%);opacity:.62}.liquid-core,.liquid-shell:after{position:absolute;border-radius:50%}.liquid-core{z-index:1;inset:-17%;transform:rotate(calc(-1 * var(--spin))) scale(1.12);background:radial-gradient(circle at 26% 20%,rgba(255,255,255,.5) 0 1%,rgba(255,255,255,.1) 8%,transparent 22%),radial-gradient(ellipse at 74% 73%,color-mix(in srgb,var(--accent2) 18%,transparent),transparent 53%),radial-gradient(ellipse at 22% 78%,color-mix(in srgb,var(--accent3) 12%,transparent),transparent 49%),linear-gradient(145deg,rgba(255,255,255,.09),transparent 35%,color-mix(in srgb,var(--accent) 8%,transparent) 74%,rgba(255,255,255,.055));filter:saturate(150%);transition:background .95s}.liquid-core:before{inset:12% 16% 12% 10%;background:linear-gradient(118deg,transparent 23%,rgba(255,255,255,.12) 39%,transparent 50%),radial-gradient(ellipse at 65% 54%,color-mix(in srgb,var(--accent2) 12%,transparent),transparent 42%);filter:blur(15px);transform:skew(-5deg,3deg) scale(1.08);opacity:.62;animation:causticLoop 6.2s ease-in-out infinite}.liquid-core:after,.liquid-core:before{content:"";position:absolute;border-radius:50%}.liquid-core:after{width:42%;height:61%;left:9%;top:2%;transform:rotate(31deg);background:linear-gradient(92deg,rgba(255,255,255,.67),rgba(255,255,255,.12) 28%,transparent 70%);filter:blur(8px);opacity:.68}.color-caustic{width:53%;height:24%;right:4%;top:34%;transform:rotate(-20deg) skewX(-10deg);background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent2) 30%,transparent),rgba(255,255,255,.12),color-mix(in srgb,var(--accent3) 22%,transparent),transparent);filter:blur(13px);mix-blend-mode:screen;opacity:.62;animation:refractLoop 5.6s ease-in-out infinite}.color-caustic,.specular{position:absolute;border-radius:50%}.specular{z-index:5;width:7%;height:7%;top:19%;left:31%;background:rgba(255,255,255,.78);box-shadow:0 0 13px rgba(255,255,255,.45);filter:blur(3px);opacity:.72}.floor-shadow{position:absolute;bottom:9%;width:49%;height:8%;border-radius:50%;background:radial-gradient(ellipse,color-mix(in srgb,var(--accent2) 18%,rgba(0,0,0,.68)),rgba(0,0,0,.38) 46%,transparent 74%);filter:blur(23px);transform:scaleX(calc(.92 + var(--wave)*.04));opacity:.66;transition:background .9s}.physics-hint{position:absolute;z-index:5;bottom:5.5%;font-size:7px;letter-spacing:.22em;color:rgba(211,226,255,.32);pointer-events:none}@keyframes floatLoop{0%,to{transform:translate3d(-3px,-8px,0) rotate(-1.2deg)}50%{transform:translate3d(4px,8px,0) rotate(1.2deg)}}@keyframes shapeFlow{0%,to{border-radius:50%}33%{border-radius:48% 52% 51% 49%/52% 49% 51% 48%}66%{border-radius:52% 48% 49% 51%/49% 52% 48% 51%}}@keyframes causticLoop{0%,to{transform:skew(-5deg,3deg) scale(1.08);filter:blur(15px)}50%{transform:skew(5deg,-3deg) scale(1.16) translate(3%,-2%);filter:blur(13px)}}@keyframes refractLoop{0%,to{transform:rotate(-20deg) skewX(-10deg);opacity:.58}50%{transform:rotate(-14deg) skewX(7deg) translate(-7%,9%) scale(1.08);opacity:.72}}.copy{position:fixed;z-index:10;left:8vw;top:50%;width:min(41vw,610px);transform:translateY(-47%);animation:copyIn .92s cubic-bezier(.16,1,.3,1)}@keyframes copyIn{0%{opacity:0;transform:translate(-34px,-40%) rotate(-1deg);filter:blur(9px)}55%{opacity:.72;transform:translate(8px,-48%) rotate(.2deg);filter:blur(2px)}to{opacity:1;transform:translateY(-47%);filter:blur(0)}}.eyebrow{display:flex;align-items:center;gap:16px;color:#89909f;font-size:10px;letter-spacing:.2em;font-weight:600}.eyebrow span{color:var(--accent2)}.eyebrow:after{content:"";width:58px;height:1px;background:linear-gradient(90deg,var(--accent2),transparent)}h1{margin:30px 0 25px;font-size:clamp(46px,5.1vw,82px);line-height:.98;letter-spacing:-.065em;font-weight:490}h1 span{display:block}.copy>p{max-width:425px;font-size:14px;line-height:1.9;color:#8d94a2}.meta{margin-top:46px;padding-top:16px;border-top:1px solid rgba(255,255,255,.09);width:300px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.16em;color:#656b78}.meta strong{color:#d5dcea;font-weight:500}.rail{position:fixed;z-index:15;left:4.5vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:15px}.rail button{display:flex;gap:8px;align-items:center;padding:0;border:0;background:none;opacity:.3;cursor:pointer;font-size:8px}.rail button i{width:10px;height:1px;background:white;transition:.3s}.rail button.active{opacity:1}.rail button.active i{width:22px;background:var(--accent2);box-shadow:0 0 7px var(--accent2)}.scroll-hint{position:fixed;z-index:10;bottom:38px;left:8vw;display:flex;align-items:center;gap:15px;font-size:8px;letter-spacing:.17em;color:#686f7d}.scroll-hint i{width:1px;height:38px;background:rgba(255,255,255,.12);position:relative}.scroll-hint b{position:absolute;inset:0;background:var(--accent2);transform-origin:top;box-shadow:0 0 5px var(--accent2)}.counter{position:fixed;z-index:10;right:4.5vw;bottom:38px;display:flex;align-items:baseline;gap:7px}.counter strong{font-size:23px;font-weight:400}.counter span{font-size:9px;color:#737a88}.chapter-label{position:fixed;z-index:10;top:115px;right:4.5vw;font-size:8px;letter-spacing:.18em;color:#646b78}.scroll-space{position:absolute;inset:0;pointer-events:none}@media (max-width:800px){.nav{height:74px;padding:0 22px}.nav nav{display:none}.mark{width:auto}.nav>button{padding:8px 10px}.glass-stage{left:58%;top:34%;width:94vw}.orb-physics{width:53%;height:53%}.copy{left:28px;top:69%;width:calc(100vw - 56px)}h1{font-size:43px;margin:17px 0}.copy>p{font-size:12px;line-height:1.6;max-width:90%}.meta,.rail{display:none}.chapter-label{top:88px;right:22px}.scroll-hint{left:28px;bottom:25px}.counter{right:24px;bottom:27px}.physics-hint{bottom:4%}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.color-caustic,.copy,.liquid-core:before,.liquid-shell,.orb-idle{animation:none}}