.section-still-layer{pointer-events:none;z-index:1;transition:opacity .9s;position:absolute;inset:0}.section-still{object-fit:fill;display:block;position:absolute}@media (prefers-reduced-motion:reduce){.section-still-layer{transition:none}}@font-face{font-family:Geist;src:url(/fonts/geist-latin.woff2)format("woff2");font-weight:100 900;font-display:swap}@font-face{font-family:GeistMono;src:url(/fonts/geist-mono-latin.woff2)format("woff2");font-weight:100 900;font-display:swap}:root{color:#fff7e6;font-synthesis:none;--mono:GeistMono, monospace;--serif:Georgia, "Times New Roman", serif;background:#111b1b;font-family:Geist,Arial,sans-serif}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}a{color:inherit}button:focus-visible,a:focus-visible{outline-offset:5px;outline:2px solid #f1bd75}button:disabled{cursor:default}::selection{color:#182923;background:#d9a460}h1,h2,p{margin:0}.experience{isolation:isolate;background:#bbc0a6;position:fixed;inset:0;overflow:hidden}.scene-mount{position:absolute;inset:0}.scene-mount canvas{touch-action:pan-y;width:100%;height:100%;display:block}.scene-shade{pointer-events:none;background:linear-gradient(90deg,#0f1d1bb8 0%,#0f1d1b7a 24%,#0f1d1b12 54%,#0000 74%),linear-gradient(#101c1942,#0000 22% 74%,#101a1861);transition:background 1s;position:absolute;inset:0}.in-darkroom .scene-shade{background:linear-gradient(90deg,#111b1bdb 0%,#111b1b7d 32%,#111b1b00 65%),linear-gradient(#101a1a32,#0000 30% 80%,#101a1a77)}.scene-transition{pointer-events:none;background:#111b1b;position:absolute;inset:0}.story-header{z-index:5;justify-content:space-between;align-items:center;height:110px;padding:0 5%;display:flex;position:absolute;top:0;left:0;right:0}.brand{letter-spacing:-.7px;white-space:nowrap;align-items:center;padding:7px 0;font-size:24px;font-weight:550;line-height:1.2;display:flex}.header-links{align-items:center;gap:25px;margin-left:auto;padding-left:24px;font-size:12px;display:flex}.header-author{color:#efeadaac;white-space:nowrap}.header-author a{color:#fff1d5;text-underline-offset:4px;-webkit-text-decoration:underline #e0c99c65;text-decoration:underline #e0c99c65}.header-repo{color:#f0e6cf;align-items:center;gap:8px;min-height:36px;text-decoration:none;display:inline-flex}.header-author a:hover,.header-repo:hover{color:#efbd80}.info-button{color:#f5ead3ce;background:#f0ecc608;border:1px solid #e0e2c935;border-radius:50%;place-items:center;width:44px;height:44px;transition:background .2s;display:grid}.info-button:hover{background:#f0ecc625}.narrative{pointer-events:none;position:absolute;inset:0}.story-caption{pointer-events:auto;width:min(29vw,395px);animation:.65s both caption-in;position:absolute;top:50%;left:7%;transform:translateY(-50%)}.chapter-kicker{font:9px var(--mono);letter-spacing:1.8px;color:#f1bc7c;align-items:center;gap:10px;display:flex}.chapter-kicker>span{background:#efb572;border-radius:50%;width:5px;height:5px;box-shadow:0 0 15px #e8b0636b}.story-caption h1{font:400 clamp(37px, 3.5vw, 58px) / 1.06 var(--serif);letter-spacing:-1.8px;text-wrap:balance;color:#fff4df;text-shadow:0 2px 22px #14282016;margin:25px 0}.story-caption.intro-caption h1{letter-spacing:-3.5px;max-width:380px;font-size:clamp(55px,5.2vw,83px)}.story-caption p{color:#f0edddba;max-width:360px;font-size:14px;line-height:1.9}.caption-detail{font:9px/1.8 var(--mono);color:#d3d6bd84;border-left:1px solid #d5b27755;max-width:345px;margin-top:26px;padding-left:14px}.story-rail{z-index:5;flex-direction:column;display:flex;position:absolute;top:50%;right:30px;transform:translateY(-50%)}.story-rail button{place-items:center;width:40px;height:34px;display:grid;position:relative}.story-rail button>span{background:#ece8cc63;border-radius:50%;width:4px;height:4px;transition:transform .3s,background .3s;display:block}.story-rail button.current>span{background:#f3bb73;transform:scale(1.7);box-shadow:0 0 0 4px #eeb16e14}.story-rail i{white-space:nowrap;font:8px var(--mono);letter-spacing:1px;opacity:0;pointer-events:none;color:#efdfc2;transition:opacity .2s;position:absolute;right:36px}.story-rail button:hover i,.story-rail button:focus-visible i{opacity:1}.story-footer{justify-content:space-between;align-items:center;gap:20px;display:flex;position:absolute;bottom:34px;left:5%;right:5%}.scroll-cue{font:8px var(--mono);letter-spacing:1.5px;color:#ecebdbb5;align-items:center;gap:12px;display:flex}.scroll-line{background:#d8dfcb78;width:40px;height:1px}.scroll-cue>svg{color:#e9bc83;animation:2s ease-in-out infinite scroll-hint}.frame-counter{font:11px var(--mono);color:#efdfbd;align-items:center;gap:12px;display:flex}.frame-counter>i{font:9px var(--mono);color:#cdd6bf70;font-style:normal}.next-step{font:8px var(--mono);letter-spacing:1.4px;color:#ecdfc5;align-items:center;gap:15px;min-height:44px;display:flex}.next-step svg{box-sizing:content-box;border:1px solid #dfdfc22e;border-radius:50%;width:38px;height:38px;padding:9px}.next-step:hover svg{background:#fff7dc12}.timeline{background:#ededcf11;width:100%;height:3px;position:absolute;bottom:0;left:0}.timeline>div{transform-origin:0;background:#e9b67c;position:absolute;inset:0}.scroll-space{pointer-events:none;height:900svh}.scene-label{font:8px var(--mono);letter-spacing:1.9px;color:#f0ecd18a;pointer-events:none;position:absolute;top:135px;right:7%}.replay{color:#ecd7b7;border-bottom:1px solid #b6baa351;align-items:center;gap:12px;min-height:44px;margin-top:25px;padding:14px 0;font-size:11px;display:flex}.loading-scene{text-align:center;z-index:10;background:#162321;place-content:center;gap:22px;display:grid;position:absolute;inset:0}.loading-scene p{font:10px var(--mono);letter-spacing:2px;color:#d2c4a7}.loading-iris{border:1px solid #d8b58050;border-top-color:#eac88d;border-radius:50%;width:40px;height:40px;margin:auto;animation:1.5s linear infinite load;display:block}.webgl-fallback{width:330px;font:12px/1.7 var(--mono);z-index:2;background:#172724;padding:18px;position:absolute;top:20%;left:7%}.notes-dialog{color:#ede8d6;background:#1b2927;border:1px solid #c2c5ad2b;border-radius:5px;max-width:560px;max-height:85svh;padding:46px;overflow-y:auto;box-shadow:0 25px 100px #0008}.notes-dialog::backdrop{-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);background:#091615b8}.notes-dialog h2{font:38px/1.13 var(--serif);letter-spacing:-1px;margin:22px 0}.notes-dialog p{color:#c1c8b7;margin-top:17px;font-size:13px;line-height:1.9}.notes-dialog .notes-small{font:9px/1.9 var(--mono);color:#929e8c;margin-top:25px}.close-notes{place-items:center;width:40px;height:40px;display:grid;position:absolute;top:15px;right:15px}.source-links{flex-direction:column;gap:15px;margin-top:27px;font-size:11px;display:flex}.source-links a{text-underline-offset:4px;color:#e1bf8f}@keyframes caption-in{0%{opacity:0;translate:0 14px}to{opacity:1;translate:0}}@keyframes scroll-hint{0%,to{transform:translateY(-3px)}50%{transform:translateY(3px)}}@keyframes load{to{transform:rotate(360deg)}}@media (width>=1600px){.story-caption{width:410px;left:8%}.story-caption h1{font-size:58px}.story-caption.intro-caption h1{font-size:88px}.story-caption p{font-size:15px}}@media (width<=1000px){.story-caption{width:34vw;left:6%}.story-caption h1{font-size:39px}.story-caption.intro-caption h1{font-size:60px}.story-caption p{font-size:12px}.caption-detail{font-size:8px}.story-rail{right:12px}.scene-label{font-size:7px;right:6%}}@media (width<=760px){.story-header{height:83px;padding:0 6%}.brand{letter-spacing:-.65px;font-size:20px}.header-links{grid-template-columns:auto 32px;gap:4px 13px;padding-left:12px;font-size:10px;display:grid}.header-author{grid-area:1/1}.header-repo{grid-area:2/1;justify-self:end;gap:5px;min-height:24px}.header-repo svg{width:13px;height:13px}.info-button{grid-area:1/2/3;width:32px;height:32px}.info-button svg{width:16px}.scene-shade{background:linear-gradient(#13272325 0%,#0000 28%,#11232105 38%,#122522d9 65%,#102321fa 100%)}.in-darkroom .scene-shade{background:linear-gradient(#111b1b22,#0000 28%,#111b1b00 37%,#111b1beb 67%,#111b1b 100%)}.story-caption{width:auto;animation-duration:.45s;inset:auto 7% 114px;transform:none}.chapter-kicker{letter-spacing:1.5px;gap:8px;font-size:7px}.story-caption h1{letter-spacing:-1px;text-wrap:balance;max-width:320px;margin:17px 0 15px;font-size:35px;line-height:1.06}.story-caption.intro-caption h1{letter-spacing:-2px;max-width:320px;font-size:49px}.story-caption p{max-width:430px;font-size:12px;line-height:1.85}.caption-detail{color:#d3d6bda2;max-width:360px;margin-top:15px;padding-left:12px;font-size:7px;line-height:1.75}.story-rail{gap:0;top:24%;right:9px}.story-rail button{width:25px;height:25px}.story-rail button>span{width:3px;height:3px}.story-rail i{display:none}.story-footer{gap:12px;bottom:24px;left:7%;right:7%}.scroll-cue{letter-spacing:1px;gap:7px;font-size:6px}.scroll-line{display:none}.scroll-cue>svg{width:13px}.frame-counter{gap:6px;font-size:9px}.frame-counter>i{font-size:7px}.next-step{gap:0}.next-step>span{display:none}.next-step svg{width:16px;height:16px;padding:12px}.scene-label{letter-spacing:1.4px;font-size:6px;top:98px;left:7%;right:auto}.timeline{height:2px}.replay{margin-top:12px;padding:9px 0;font-size:10px}.notes-dialog{width:calc(100% - 32px);padding:36px 27px}.notes-dialog h2{font-size:32px}.notes-dialog p{font-size:12px}.source-links{font-size:10px;line-height:1.6}.webgl-fallback{width:86%;top:19%;left:7%}}@media (width<=360px){.brand{font-size:17px}.header-links{column-gap:9px;padding-left:9px}}@media (height<=720px) and (width<=760px){.story-caption{bottom:85px}.story-caption h1{margin:12px 0;font-size:29px}.story-caption.intro-caption h1{font-size:40px}.story-caption p{font-size:10.5px;line-height:1.7}.caption-detail{margin-top:12px;font-size:6.5px}.story-footer{bottom:16px}.story-header{height:67px}.scene-label{top:77px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}html{scroll-behavior:auto}}.notes-equations{gap:7px;margin:18px 0 4px;display:grid}.notes-equations span{color:#c9d2c2a6;font-size:11px;line-height:1.5;display:block}.notes-equations b{font:12px var(--mono);letter-spacing:.3px;color:#ffe4b6;margin-bottom:1px;font-weight:400;display:block}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .narrative{z-index:3}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption{width:min(27vw,380px)}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption h1{font-size:clamp(34px,3.3vw,55px)}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption p{color:#ebeedecc}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .caption-detail{color:#c6d1bba8}.caption-reaction{color:#efc891;margin-bottom:10px;font-size:10px;display:block}.caption-science{color:#cfdbca;align-items:center;gap:18px;min-height:44px;margin-top:12px;padding:0;font-size:11px;display:inline-flex}.caption-science>span{color:#e8bc82;font-size:19px}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .scene-label{display:none}.current-chemistry{border-block:1px solid #e6c79733;margin:22px 0;padding:23px 0}.current-chemistry h3{font:400 27px/1.15 var(--serif);color:#f9eed7;margin:15px 0}@media (width<=1000px) and (width>=761px){:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption{width:29%;left:6%}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption h1{font-size:33px}}@media (width<=760px){:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption{width:auto;inset:96px 10% auto 7%;transform:none}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption h1{max-width:360px;margin:12px 0;font-size:28px;line-height:1.08}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption p{max-width:none;font-size:12px;line-height:1.6}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .caption-detail,:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .caption-science{display:none}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-rail{top:54%}}@media (prefers-reduced-motion:reduce){:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-caption{animation:none}}:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .story-footer,:is(.is-darkroom-lab,.is-print-lab,.is-color-lab,.is-film-transfer) .timeline{z-index:5}
