@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400&family=Manrope:wght@300;400;500&display=swap";:root{font-family:Manrope,system-ui,sans-serif;color:#ece8dd;background:#07100d;--life:#91e3a7;--cyan:#75cfc5;--amber:#e6b868;--line:rgba(210,233,218,.14);--muted:#82948b}*{box-sizing:border-box}html,body,#root{margin:0;min-width:320px;min-height:100%;background:#07100d}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline:1px solid var(--life);outline-offset:4px}.eyebrow{color:var(--life);font:9px/1.5 DM Mono;letter-spacing:.17em}.brand{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;font:10px DM Mono;letter-spacing:.14em}.brand>i{width:7px;height:7px;border:1px solid var(--life);border-radius:50%;box-shadow:0 0 10px var(--life)}.brand b{font-weight:400;color:#53675d;margin-left:5px}.brand em{font-style:normal;color:var(--life);border-left:1px solid var(--line);padding-left:10px}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:38px;padding:15px 18px;background:#508e6324;border:1px solid rgba(145,227,167,.4);font-size:12px;cursor:pointer}.secondary{padding:12px 3px;background:none;border:0;border-bottom:1px solid #4a5d52;color:#899b91;font-size:11px;cursor:pointer}.landing{position:relative;min-height:100vh;overflow:hidden;padding:34px 5vw;background:radial-gradient(circle at 80% 48%,rgba(83,151,104,.12),transparent 31%),#07100d}.landing header{position:relative;z-index:3}.hero{position:relative;z-index:3;width:min(780px,64vw);margin:clamp(100px,16vh,170px) 0 0 7vw}.hero h1{font-weight:300;font-size:clamp(55px,6.6vw,104px);line-height:.92;letter-spacing:-.06em;margin:25px 0}.hero h1 em{font-style:normal;color:#82968b}.hero>p:not(.eyebrow){max-width:520px;color:#99aaa1;font-size:clamp(14px,1.2vw,18px);line-height:1.7}.hero .primary{margin:20px 20px 0 0}.hero small{display:block;color:#596b61;font:8px DM Mono;letter-spacing:.11em;text-transform:uppercase;margin-top:20px}.landing footer{position:absolute;left:5vw;bottom:32px;color:#586a60;font:8px DM Mono;letter-spacing:.08em}.hero-cell{position:absolute;right:-4vw;top:7vh;width:min(57vw,780px);aspect-ratio:1;display:grid;place-items:center}.orb{position:relative;width:78%;height:72%;border:1px solid rgba(145,227,167,.2);border-radius:52% 47% 55% 43%;box-shadow:inset 0 0 90px #42875817,0 0 90px #3f805314;animation:breathe 8s ease-in-out infinite}.orb>i:first-child{position:absolute;top:24%;right:24%;bottom:24%;left:24%;border-radius:50%;border:1px solid rgba(117,207,197,.3);background:#41796d1f}.orb>i:nth-child(2),.orb>i:nth-child(3){position:absolute;width:13%;height:7%;border:1px solid rgba(230,184,104,.25);border-radius:50%;transform:rotate(25deg);left:17%;top:24%}.orb>i:nth-child(3){left:auto;right:13%;top:67%;transform:rotate(-32deg)}.orb>b{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--life);left:68%;top:25%;box-shadow:-130px 170px 0 var(--cyan),70px 130px 0 var(--amber);opacity:.45}@keyframes breathe{50%{transform:scale(1.025) rotate(.5deg);border-radius:47% 54% 44% 56%}}.experience{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;background:#07100d}.top{position:absolute;z-index:9;left:0;right:0;top:0;height:72px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 3.2vw}.top button{border:0;background:none;color:#788b81;font:8px DM Mono;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}.grain{position:absolute;z-index:8;pointer-events:none;top:-80%;right:-80%;bottom:-80%;left:-80%;opacity:.023;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 150 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.world{position:absolute;top:72px;right:0;bottom:0;left:0;background:radial-gradient(circle at 69% 49%,rgba(67,132,87,.13),transparent 38%),linear-gradient(125deg,#07100d,#08130f);overflow:hidden}.cell{--s:var(--scale);position:absolute;width:min(63vw,820px);height:min(70vh,620px);right:2vw;top:50%;transform:translateY(-50%) scale(var(--s));transform-origin:63% 50%;border:1px solid rgba(145,227,167,.2);border-radius:53% 47% 49% 51%;background:radial-gradient(circle at 60% 48%,rgba(95,157,114,.09),transparent 42%);transition:transform 1.2s cubic-bezier(.2,.7,.1,1),opacity .6s}.membrane{position:absolute;top:5px;right:5px;bottom:5px;left:5px;border:1px dashed rgba(145,227,167,.11);border-radius:inherit;animation:membrane 6s ease-in-out infinite}.nucleus{position:absolute;width:36%;aspect-ratio:1;left:39%;top:28%;border:1px solid rgba(117,207,197,.33);border-radius:49% 51% 48% 52%;background:radial-gradient(circle,#33686236,#1c433e1f);box-shadow:inset 0 0 35px #75cfc514}.nucleolus{position:absolute;width:8%;aspect-ratio:1;left:52%;top:40%;border-radius:50%;background:#75cfc52e;filter:blur(1px)}.mito{position:absolute;width:14%;height:6%;border:1px solid rgba(230,184,104,.32);border-radius:50%;transform:rotate(24deg);left:13%;top:27%}.mito:after{content:"";position:absolute;top:32%;right:10%;bottom:32%;left:10%;border-top:1px dotted rgba(230,184,104,.45)}.m2{left:71%;top:70%;transform:rotate(-35deg)}.golgi{position:absolute;left:24%;bottom:20%;width:13%;height:13%;border-top:1px solid rgba(145,227,167,.3);border-radius:50%;box-shadow:0 8px #91e3a721,0 16px #91e3a717}.vesicle{position:absolute;width:9px;height:9px;border:1px solid var(--life);border-radius:50%;left:32%;bottom:16%;opacity:.5}.v2{left:37%;bottom:12%}.dna{position:absolute;width:32%;height:28%;left:41%;top:32%;opacity:.28;transition:all 1s}.dna:before,.dna:after{content:"";position:absolute;left:50%;top:0;width:1px;height:100%;background:var(--cyan);transform:rotate(20deg);box-shadow:20px 0 var(--cyan)}.dna i{position:absolute;left:45%;width:25px;border-top:1px solid var(--cyan);transform:rotate(20deg)}.dna i:nth-child(1){top:7%}.dna i:nth-child(2){top:23%}.dna i:nth-child(3){top:39%}.dna i:nth-child(4){top:55%}.dna i:nth-child(5){top:71%}.dna i:nth-child(6){top:87%}.polymerase{position:absolute;width:7%;height:8%;left:54%;top:47%;border:1px solid var(--amber);border-radius:45%;opacity:0;box-shadow:0 0 24px #e6b86833}.rna{position:absolute;left:53%;top:53%;color:var(--life);font:6px DM Mono;letter-spacing:.12em;white-space:nowrap;opacity:0}.pore{position:absolute;width:4%;height:2%;left:72%;top:50%;border:1px solid var(--cyan);border-radius:50%;opacity:0}.ribosome{position:absolute;width:11%;height:8%;left:75%;top:51%;opacity:0}.ribosome i,.ribosome b{position:absolute;border:1px solid var(--amber);border-radius:50%;top:0;right:0;bottom:45%;left:0}.ribosome b{top:45%;right:10%;bottom:0;left:10%}.chain{position:absolute;left:84%;top:56%;display:flex;gap:3px;transform:rotate(65deg);transform-origin:left;opacity:0}.chain i{width:6px;height:6px;border:1px solid var(--life);border-radius:50%}.protein{position:absolute;right:7%;top:28%;width:12%;height:15%;opacity:0}.protein i{position:absolute;width:24px;height:24px;border:1px solid var(--life);border-radius:50%;box-shadow:0 0 12px #91e3a71f}.protein i:nth-child(2){left:20px;top:15px}.protein i:nth-child(3){left:2px;top:34px}.protein i:nth-child(4){left:34px;top:39px}.protein i:nth-child(5){left:46px;top:5px}.scale-label{position:absolute;z-index:2;right:3vw;bottom:3vh;text-align:right;color:#5d7065;font:7px DM Mono;letter-spacing:.1em;text-transform:uppercase}.scale-label b,.scale-label span{display:block}.scale-label b{color:var(--life);font-weight:400;margin-bottom:5px}.phase-nucleus .cell,.phase-gene .cell,.phase-transcribe .cell,.phase-edit .cell{border-color:#91e3a70f}.phase-gene .dna,.phase-transcribe .dna,.phase-edit .dna{opacity:1}.phase-transcribe .polymerase,.phase-edit .polymerase{opacity:1;animation:read 3s ease-in-out infinite}.phase-transcribe .rna,.phase-edit .rna,.phase-translate .rna,.phase-edit .pore,.phase-translate .pore,.phase-translate .ribosome,.phase-translate .chain,.phase-fold .ribosome,.phase-fold .chain{opacity:1}.phase-fold .protein{opacity:1;animation:breathe 4s ease-in-out infinite}.phase-fold .cell{opacity:.9}@keyframes membrane{50%{top:8px;right:3px;bottom:4px;left:7px}}@keyframes read{50%{transform:translate(38px)}}.story{position:absolute;z-index:5;left:6.5vw;bottom:13vh;width:min(570px,45vw);animation:in .6s ease both}.story>span{color:var(--amber);font:9px DM Mono;letter-spacing:.14em}.story h2{font-size:clamp(38px,4.5vw,68px);line-height:1;letter-spacing:-.05em;font-weight:300;margin:18px 0 13px}.story p{color:#97a79e;font-size:13px;line-height:1.65;max-width:510px}.story small{display:block;color:#65786d;font:9px/1.6 DM Mono;letter-spacing:.04em}.story>button{margin-top:17px;padding:0 0 6px;border:0;border-bottom:1px solid rgba(145,227,167,.45);background:none;color:var(--life);font:9px DM Mono;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}.story-nav{position:absolute;z-index:7;left:50%;bottom:5.5vh;transform:translate(-50%);display:flex;gap:12px;align-items:center}.story-nav button{width:30px;height:30px;background:#07100dd9;border:1px solid var(--line);cursor:pointer}.story-nav button:disabled{opacity:.2}.story-nav i{color:#5b6e63;font:8px DM Mono;font-style:normal}.progress{position:absolute;z-index:6;left:6.5vw;right:6.5vw;bottom:5.5vh;height:1px;background:linear-gradient(to right,var(--life) var(--p),rgba(255,255,255,.12) var(--p))}@keyframes in{0%{opacity:0;transform:translateY(14px)}}.phase-nav{position:absolute;z-index:5;left:3vw;top:100px;display:flex;flex-direction:column}.phase-nav button{width:150px;padding:10px 12px;text-align:left;border:1px solid var(--line);background:#050d0aba;color:#65776d;text-transform:uppercase;font:8px DM Mono;cursor:pointer}.phase-nav button+button{border-top:0}.phase-nav span{color:#44564c;margin-right:10px}.phase-nav button.active{color:#e8e6dc;background:#91e3a71a;box-shadow:inset 2px 0 var(--life)}.lab-panel{position:absolute;z-index:5;left:3vw;bottom:4vh;width:min(520px,44vw)}.lab-panel h2{font-size:clamp(27px,3.4vw,49px);line-height:1.02;letter-spacing:-.04em;font-weight:300;margin:8px 0 16px}.lab-panel label{display:grid;grid-template-columns:100px 1fr;align-items:center;gap:10px;margin-top:17px;color:#66786e;font:8px DM Mono;text-transform:uppercase}.lab-panel input{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:1px;background:#41564a}.lab-panel input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:8px;height:8px;border-radius:50%;background:var(--life)}.sequence{position:absolute;z-index:5;right:3vw;top:96px;width:min(420px,36vw);padding:15px;border:1px solid var(--line);background:#040c09a8}.sequence>p{margin:0 0 12px;color:#63766b;font:7px DM Mono;letter-spacing:.12em}.letters{display:grid;grid-template-columns:44px repeat(15,1fr);margin-top:7px}.letters b,.codons>b{color:#62756a;font:7px DM Mono;font-weight:400}.letters i{font:7px DM Mono;font-style:normal;text-align:center;color:var(--cyan)}.rna-row i{color:var(--life)}.codons{display:grid;grid-template-columns:44px repeat(5,1fr);margin-top:12px}.codons span{font:7px DM Mono;color:var(--amber);text-align:center}.codons em{display:block;color:#687a70;font-style:normal;font-size:6px;margin-top:4px}.scrim{position:fixed;z-index:20;top:0;right:0;bottom:0;left:0;background:#010503bf;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;justify-content:flex-end}.info{position:relative;width:min(580px,100%);height:100%;overflow:auto;padding:7vh 7%;background:#09140f;border-left:1px solid var(--line)}.close{position:absolute;right:28px;top:20px;border:0;background:none;font-size:27px;color:#788b80;cursor:pointer}.info h2{font-size:clamp(38px,4vw,58px);font-weight:300;line-height:1;letter-spacing:-.05em}.info>p:not(.eyebrow){color:#94a49b;font-size:12px;line-height:1.7}.info dl div{display:grid;grid-template-columns:95px 1fr;border-top:1px solid var(--line);padding:14px 0}.info dt{color:var(--life);font:8px DM Mono;text-transform:uppercase}.info dd{margin:0;color:#82938a;font-size:10px;line-height:1.6}.info h3{font:9px DM Mono;letter-spacing:.12em;text-transform:uppercase}.info>a{display:block;color:#87988e;border-top:1px solid var(--line);padding:10px 0;font-size:10px;text-decoration:none}.info .primary{margin-top:18px}@media(max-width:760px){.landing{padding:24px 22px 90px;overflow-y:auto}.hero{width:auto;margin:15vh 0 0}.hero h1{font-size:clamp(50px,14.3vw,69px)}.hero .primary{display:flex;margin-right:0}.hero .secondary{display:block;margin-top:8px}.landing footer{position:relative;left:auto;bottom:auto;margin-top:100px}.hero-cell{width:115vw;right:-65vw;top:8vh}.top{height:62px;padding:0 18px}.top button{font-size:0}.top button:after{content:"?";font-size:14px}.world{top:62px;right:0;bottom:0;left:0}.cell{width:105vw;height:59vh;right:-45vw;top:41%;transform-origin:62% 48%}.story{left:22px;bottom:14vh;width:calc(100% - 44px)}.story h2{font-size:37px;max-width:94%}.story p{font-size:11px;max-width:90%}.story small{font-size:8px;max-width:93%}.progress{left:22px;right:22px}.phase-nav{left:14px;right:14px;top:77px;flex-direction:row;overflow-x:auto;scrollbar-width:none}.phase-nav button{min-width:113px;width:auto}.phase-nav button+button{border-top:1px solid var(--line);border-left:0}.lab-panel{left:18px;bottom:3vh;width:calc(100% - 36px)}.lab-panel h2{font-size:29px;max-width:80%}.lab-panel .primary{padding:12px}.sequence{right:14px;top:132px;width:calc(100% - 28px);overflow:hidden}.sequence>p{display:none}.scale-label{display:none}.letters{grid-template-columns:36px repeat(15,1fr)}.experience.lab .cell{top:50%;right:-50vw}.experience.lab .world{opacity:.8}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}.grain{display:none}}