@import"https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100..900;1,100..900&display=swap";.app{width:100vw;height:100vh;background:#000;margin:0;padding:0;overflow:hidden;font-family:Libre Franklin,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex}.number-line{min-width:80px;max-width:300px;width:auto;height:100vh;background:#000;display:flex;flex-direction:column;align-items:flex-start;padding:15px 8px;overflow:hidden;position:relative;transition:width .5s ease}.number-line-item{font-size:.8rem;font-weight:300;color:#fff;margin:2px 0;padding:4px 8px;border-radius:4px;transition:all 1.2s cubic-bezier(.4,0,.2,1);opacity:0;transform:translateY(-60px);position:relative;min-width:50px;max-width:280px;text-align:left;will-change:transform,opacity;word-break:break-all;line-height:1.2}.number-line-item:nth-child(1){opacity:1}.number-line-item:nth-child(2){opacity:.95}.number-line-item:nth-child(3){opacity:.9}.number-line-item:nth-child(4){opacity:.85}.number-line-item:nth-child(5){opacity:.8}.number-line-item:nth-child(6){opacity:.75}.number-line-item:nth-child(7){opacity:.7}.number-line-item:nth-child(8){opacity:.65}.number-line-item:nth-child(9){opacity:.6}.number-line-item:nth-child(10){opacity:.55}.number-line-item:nth-child(11){opacity:.5}.number-line-item:nth-child(12){opacity:.45}.number-line-item:nth-child(13){opacity:.4}.number-line-item:nth-child(14){opacity:.35}.number-line-item:nth-child(15){opacity:.3}.number-line-item:nth-child(16){opacity:.28}.number-line-item:nth-child(17){opacity:.26}.number-line-item:nth-child(18){opacity:.24}.number-line-item:nth-child(19){opacity:.22}.number-line-item:nth-child(n+20){opacity:.2}.number-line-item.large-number{font-size:.6rem;padding:3px 6px}.number-line-item.visible{opacity:1;transform:translateY(0)}.number-line-item.visible:nth-child(1){opacity:1}.number-line-item.visible:nth-child(2){opacity:.95}.number-line-item.visible:nth-child(3){opacity:.9}.number-line-item.visible:nth-child(4){opacity:.85}.number-line-item.visible:nth-child(5){opacity:.8}.number-line-item.visible:nth-child(6){opacity:.75}.number-line-item.visible:nth-child(7){opacity:.7}.number-line-item.visible:nth-child(8){opacity:.65}.number-line-item.visible:nth-child(9){opacity:.6}.number-line-item.visible:nth-child(10){opacity:.55}.number-line-item.visible:nth-child(11){opacity:.5}.number-line-item.visible:nth-child(12){opacity:.45}.number-line-item.visible:nth-child(13){opacity:.4}.number-line-item.visible:nth-child(14){opacity:.35}.number-line-item.visible:nth-child(15){opacity:.3}.number-line-item.visible:nth-child(16){opacity:.28}.number-line-item.visible:nth-child(17){opacity:.26}.number-line-item.visible:nth-child(18){opacity:.24}.number-line-item.visible:nth-child(19){opacity:.22}.number-line-item.visible:nth-child(n+20){opacity:.2}.number-line-item.highlight-sum{background:#fff3;box-shadow:0 0 20px #ffffff4d}.number-line-item.highlight-result{background:#00ff804d;box-shadow:0 0 20px #00ff8080;color:#00ff80}.animation-container{flex:1;width:100%;height:100%;display:flex;align-items:center;justify-content:center;perspective:2500px;perspective-origin:center center}.emerging-number{position:absolute;font-size:18rem;font-weight:200;color:var(--neon-color, #ff0080);transform-style:preserve-3d;opacity:1;letter-spacing:.1em;left:50%;top:50%;transform-origin:center center;display:flex;align-items:center;justify-content:center;animation:emergeAndFlyPast 20s cubic-bezier(.9,0,1,1) forwards;z-index:var(--z-index, 1)}@keyframes emergeAndFlyPast{0%{transform:translate(-50%,-50%) translateZ(-3000px) scale(.01);opacity:0}20%{opacity:1}50%{opacity:1}to{transform:translate(-50%,-50%) translateZ(6000px) scale(20);opacity:0}}@media (max-width: 1200px){.emerging-number{font-size:14rem}}@media (max-width: 768px){.emerging-number{font-size:10rem}}@media (max-width: 480px){.emerging-number{font-size:7rem}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;color:#fff;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9;color:#213547}}
